Cristian Boariu
Cristian Boariu

Reputation: 9621

IE9 strange position fixed issue

If you go here, while scrolling down the page you will notice that the right panel containing shopping and categories is moving along also...

I use this script for this:

 $(function () {
    var btn = $('.scroll');
    var btnPosTop = btn.offset().top;
    var win = $(window);
    win.scroll(function (e) {
        var scrollTop = win.scrollTop();
        if (scrollTop >= btnPosTop) {
            btn.css({ position: 'fixed', top: 10, marginTop: 0, 'z-index': 1, width: '260px'});
        } else if (btn.css('position') === 'fixed') {
            btn.css({ position: '', top: '', marginTop: '0px', 'z-index': 0 });
        }
    });
});

All works nice except that in IE 9, the div is no longer shown while scrolling down(oh, right, it is there but is not visible).

As you can notice, I've even tried to use z-index in the above script hoping that this will fix the issue, but it's in vain.

Can you guys suggest a solution?

Upvotes: 0

Views: 1273

Answers (1)

mddw
mddw

Reputation: 5580

Add a position : relative to your #sidebar.

z-index only works when position is not static.

Upvotes: 2

Related Questions