Faking Fixed Position in IE6

Posted by Andrew on Stack Overflow See other posts from Stack Overflow or by Andrew
Published on 2010-04-21T12:52:02Z Indexed on 2010/04/21 12:53 UTC
Read the original article Hit count: 275

Filed under:
|
|
|

I have a site that utilizes a bottom fixed position masthead here: http://www.entheospartners.com/newsite/

This setup works great in all browsers except IE6, which doesn't support fixed positioning in the least, so here's what I've done:

When an IE6 user comes to the page, I make the determination if scrolling is necessary using this bit of code:

var windowHeight = $(window).height();
var totalHeight = windowHeight - 100; // where 100 is the sum of the top nav height + footer height
var contentHeight;

if($('#subpage-content-small').length) { // main content div for a three column layout
    contentHeight = $('#subpage-content-small').height();
};

if($('#subpage-content-wide').length) { // main content div for a two column layout
    contentHeight = $('#subpage-content-wide').height();
};

if(contentHeight > totalHeight) {
    $('#container-container').css({
        'overflow-y' : "scroll",
        'height' : totalHeight
    });
};

...which calculates everything correctly, puts the scrollbars where they need to be (flush right), and sets them to the appropriate height. The problem is that the scrollbars don't move the content. I can't say that I've ever seen anything quite like this before, so I'm hoping someone else on here has. Thanks in advance!

PS - Obviously, this needs to be looked at in IE6 for troubleshooting, which I know will be as painful for you as it is for me.

© Stack Overflow or respective owner

Related posts about ie6

Related posts about css-positioning