javascript - 滚动淡入淡出在 Firefox 上不起作用

标签 javascript css animation fadein fadeout

我有淡出问题。它似乎适用于 chrome,但不适用于 firefox。有人可以帮助我吗?非常感谢!

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);
    }
});

这是代码 ( https://jsfiddle.net/tbwst60o/3/embedded/result/ )

最佳答案

不同的浏览器以不同的方式获取该变量。

这是来自 this answer 的函数应用于您的代码。

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;
    }
}

虽然...jQuery 已经内置了这个。

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

关于javascript - 滚动淡入淡出在 Firefox 上不起作用,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34243532/

相关文章:

javascript - 如何格式化包含在html结构中特定符号内的文本并对其进行格式化

html - 静态和响应式页脚 Bootstrap

javascript - Jquery 不分配 CSS 类

css3 动画硬闪烁(帧之间没有淡入淡出)

python - 保存 matplotlib.animation 输出 0 秒视频

javascript - 删除 p 标签之间的  

javascript - Vue.js 按小数排序

onclick 事件触发时调用的函数中的 Javascript switch 语句

css - 输入无效值时,如何更改文本类型输入字段的背景颜色?

Android - 如何在缩放后找到一个 Rect