absolutely positioned divs that don't move when page is scrolled...

Posted by Kyle on Stack Overflow See other posts from Stack Overflow or by Kyle
Published on 2010-05-18T20:48:47Z Indexed on 2010/05/18 20:50 UTC
Read the original article Hit count: 143

Filed under:

absolute-positioning

|

scrolling

|

non-scrolling

|

html-element

I've done this in the past using a method similar to this: http://javascriptkit.com/javatutors/static3.shtml

but I don't like the "flicker" effect as the page is scrolled and the div needs to move with the scrolling. Lately I've seen a lot of site that have an element (a div or the like I presume) that don't move when the page is scrolled but it's seemless...they're just there and it's a beautiful thing.

Unfortunately I can't seem to recall where I've seen it lately to view the source and try to figure it out so I figured I'd turn here and see what all of you experts can provide as far as assistance / suggestions.

TIA

© Stack Overflow or respective owner

Related posts about absolute-positioning

Javscript: creating div with absolute positioning

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, Just wondering if there's a way to position a div with absolute so that it ignores EVERYTHING else, if my site clears floats it seems divs that are created with javascript and absolute positioning are still effected by it, is there any way to make them ignore EVERYTHING else and go exactly where… >>> More
Div positioning problem related to Relative and Absolute positioning

as seen on Stack Overflow - Search for 'Stack Overflow'
Hello everyone. The problem I am running into is related to a footer I have absolutely positioned at the bottom of the page. Everything is fine until the copy on the page begins to extend further down the page which then causes my content wells to extend down, behind, the footer. Is there anyway… >>> More
IE7 relative/absolute positioning bug with dynamically modified page content

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, I was wondering if there's anyone having an idea how to tackle with the following problem in IE7: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> … >>> More
Making an svg image object clickable with onclick, avoiding absolute positioning

as seen on Stack Overflow - Search for 'Stack Overflow'
I have tried to change the images on my site from to svg, changing img tags to embed and object tags(standard procedure, i think). But, implementing the onclick function, which previously was contained in the img tag is proving most difficult. I found onclick had no effect when placed inside the… >>> More
IE and absolute positioning divs

as seen on Stack Overflow - Search for 'Stack Overflow'
This problem is only in IE. Consider the following HTML: <html> <body> <div style='position:absolute;left:1em;right:1em;top:1em;bottom:1em;overflow:auto;'> Put more than a full screen of text in here. It should create a scroll inside the div. In IE, it stretches the div out… >>> More

Related posts about scrolling

Perfect solution to enable both two finger scrolling and edge scrolling in Ubuntu 13.10 permanantly

as seen on Ask Ubuntu - Search for 'Ask Ubuntu'
Recently, I have upgraded from 13.04 to 13.10. First, I found problem in edge scrolling. After surfing in net about the problem I came to know that Ubuntu 13.10 has default two-finger scroll option enabled in Mouse and Touchpad setting. After unchecking two-finger scroll edge scrolling was enabled… >>> More
Switching between iScroll and standard WebView Scrolling functionality

as seen on Stack Overflow - Search for 'Stack Overflow'
I'm using iScroll 4 for my rather heavy iPhone web/Phonegap app and trying to find a way to switch between iScrolls scrolling functionality and standard "native" webview scrolling, basically on click. Why I want this is described below. My app has several different subpages all in one file. Some… >>> More
Eliminate horizontal scrolling in div in favor of horizontal scrolling in browser window

as seen on Stack Overflow - Search for 'Stack Overflow'
I have a div, set to 800px wide, that will automatically scroll horizontally if the browser window is resized to < 800px. The behavior I would like, is to have the browser window scroll instead of the div. It would seem simple but for some reason I'm getting hung up on it. Any ideas? The page… >>> More
How to disable UIWebview horizontal scrolling?

as seen on Stack Overflow - Search for 'Stack Overflow'
I've tried disabling it by inserting: into my HTML string, and a dozen variations of the above in the vain hope that I just screwed up the tag syntax... but nothing seems to stop UIWebView from scrolling horizontally. And yet there are apps that manage to do this (like MobileRSS), and presumably… >>> More
Blackberry storm 9530 tracing touch events while scrolling

as seen on Stack Overflow - Search for 'Stack Overflow'
hey in my screen there is a an edit field and 2 custom button fields as "OK" and "CANCEL" Below buttonfield there are some more focussable label fields when i write a name in edit field and press enter then focus comes to "OK" button but how to set focus on "CANCEL" button. Moreover while scrolling… >>> More