Deprecated
This fix is deprecated and is no longer supported (meaning that I will not help you to get it working with your pages). It was only written to fill the gap while waiting for Internet Explorer to implement fixed positioning. That has now happened in IE 7. Although this fix can make it work in IE 6 as well, that is counter productive for the future of the Web. IE 6 is a major problem to Web developers (IE 7 is a problem as well, but for now, let's overlook that, since it does at least implement fixed positioning), and the sooner it stops being used, the better.
Instead of using this hack, users of IE 6 should be encouraged to upgrade to IE 7. Users who cannot upgrade to IE 7 (because IE 7 is not being released for most Windows operating systems) should use a better browser, such as Opera or Firefox. They have been abandoned by Microsoft.
What is position: fixed;?
position: fixed; is an alternative to position: absolute; position: relative; and position: static;.
position: fixed; is basically the same as position: absolute; except that when the user scrolls the page, the element
does not scroll with it, it just says exactly where it was. There are many pages that want to use this in order to position
logos or menus.
What is wrong with position: fixed;?
Well, ... nothing. The problem is that the most popular browser - Internet Explorer for Windows - does not understand
it, and instead of reverting to position: absolute; which would be better than nothing, it reverts to position: static; as
specified by the CSS standard. This has the same effect as having no positioning at all. Note that IE 7 from beta 2 upwards
does support position: fixed; (if you use a document type declaration that triggers strict mode) so I will exclude IE 7 from this fix.
As a result, serveral people write scripts that use setInterval to reposition an absolutely positioned element every few
miliseconds, or (ignoring Netscape 4) when the onscroll event is detected. This produces a slightly jerky effect. It would
be better if the position: fixed; style could be applied in browsers that supported it, and browsers that didn't could use
position: absolute; and JavaScript. Some authors use the > CSS selector to isolate Internet Explorer and leave the element
positioned absolutely in that browser, without the scrolling effect.
div#fixme { position: absolute; left: 0px; top: 0px; }
body > div#fixme { position: fixed; }
It produces a reasonably nice effect, but it is even better when coupled with a JavaScript that checks if the position is
'absolute' using the currentStyle property, and then repositioning the element when the onscroll event is detected.
F
i
x
M
e
F
i
x
M
e
T
o
o
No comments:
Post a Comment