CODEWITHSUNDEEP
jquerycssinternet-explorer-8internet-explorer-7position
Jacob
Jacob

Reputation: 1483

Using jQuery to set position from absolute to fixed in IE7 & IE8

var uf = $('.utilsFloat');
var topValue = $('.article .header').offset().top;
uf.css({
    top : topValue,
    marginLeft : -137,
    position: 'absolute'
});

$(document).scroll(function() {

    var fixedShareTools = $(document).scrollTop() >= topValue;

    if (fixedShareTools) {
        uf.css(
            {
                top : 10 + "px",
                "position" : "fixed"
            }
        );
    }
    else {
        uf.css(
            {
                "position" : "absolute",
                top : topValue + "px"
            }
        )
    }});

The code above is trying to set an item's position attribute to "fixed" when you scroll past a header on the page. It works great in everything except IE8 and 7. Are there issues with the jQuery .css() method in IE7/8?

Is there a solution to this problem?

Upvotes: 1

Views: 1654

Answers (1)

Jacob
Jacob

Reputation: 1483

I found a solution.. I ended up using classes instead and this worked.

if ($('body').hasClass('content-article')) {
//Pulling the top position value of the article header so the share tools align with it always
var uf = $('.utilsFloat');
var topValue = $('.article .header').offset().top;
uf.css({top : topValue });

$(window).scroll(function() {

    var fixedShareTools = $(window).scrollTop() >= topValue;

    if (fixedShareTools) {
        uf.removeClass('absolute');
        uf.addClass('fixed');
    }
    else {
        uf.removeClass('fixed');
        uf.addClass('absolute');
        uf.css(top, topValue + "px");
    }});}

Upvotes: 1

Related Questions