Scrolling fade doesn't work on firefox

Question

I've a problem with fadeout. It seem works on chrome but it doesn't work on firefox. Someone could help me? many thanks!

https://jsfiddle.net/tbwst60o/

var scrollPos;
$(window).scroll(function() {
    var scrollPos = document.body.scrollTop;

    if (scrollPos < 10) {
            $('#cc-m-12786466225').fadeTo(100,1);
    } else {
            $('#cc-m-12786466225').fadeTo(100,0);
    }
});

here's the code (https://jsfiddle.net/tbwst60o/3/embedded/result/)

It's not the issue but you've declared scrollPos globally, then again inside the function. If you want the value to be global, remove `var` from where you set scrollPos in the function — Popnoodles, Dec 12 '15 at 19:03
The image that I want to fade out is fixed on the center of windows in the landing page of an homepage. When I scroll down it have to fade out. I've tried to remove the var but it still not working and the image doesn't fade out on fire fox. It's ok on chrome, the problem is on firefox. I've just try with .fadein .fadeout/ animate also. — vlk, Dec 12 '15 at 19:17

score 1 · Accepted Answer · edited May 23 '17 at 12:31

Different browsers get that variable different ways.

Here's the function from this answer applied to your code.

https://jsfiddle.net/tbwst60o/2/

$(window).scroll(function() {
    if (getScrollTop() < 10) {
            $('#cc-m-12786466225').fadeTo(100,1);
    } else {
            $('#cc-m-12786466225').fadeTo(100,0);
    }
});

function getScrollTop(){
    if(typeof pageYOffset!= 'undefined'){
        //most browsers except IE before #9
        return pageYOffset;
    }
    else{
        var B= document.body; //IE 'quirks'
        var D= document.documentElement; //IE with doctype
        D= (D.clientHeight)? D: B;
        return D.scrollTop;
    }
}

Although... jQuery already has this built in.

$(window).scroll(function() {
    if ($(window).scrollTop() < 10) {
            $('#cc-m-12786466225').fadeTo(100,1);
    } else {
            $('#cc-m-12786466225').fadeTo(100,0);
    }
});

Something is changed now the image start flashing but not fade out — vlk, Dec 12 '15 at 19:36

Scrolling fade doesn't work on firefox

1 Answers1