Question

我有这个脚本，除了firefox之外，它在每个浏览器中都能正常工作。

＆＃13;

var header = document.getElementById('header');
var arrow = document.getElementsByClassName('toTop-transparent')[0];
window.onscroll = function () {
    "use strict";
    if (document.body.scrollTop > 7) {
        header.className = 'header-colored';
        arrow.className = 'toTop';
    } else {
        header.className = 'header-transparent';
        arrow.className = 'toTop-transparent';
    }
};

＆＃13;

脚本似乎根本没有加载。它应该在滚动时改变我的标题的颜色，并带来一个回到顶部＆＃39;按钮，但在Firefox中它什么都不做。关于为什么这不起作用的任何想法？

我尝试将浏览器更新到最新版本，在安全模式下启动，没有任何附加组件。

编辑：我的网站上的控制台中不再出现任何错误。脚本仍然无法加载，似乎脚本中有一些内容是firefox不理解的？

Answer 1

此代码适用于IE，Chrome和FF：

var header = document.getElementById('header');
var arrow = document.getElementsByClassName('toTop-transparent')[0];
var supportPageOffset = window.pageXOffset !== undefined;

window.onscroll = function() {
  "use strict";
  var y = supportPageOffset ? window.pageYOffset : isCSS1Compat ? document.documentElement.scrollTop : document.body.scrollTop;

  if (y > 7) {
    console.log('here 1')
    header.className = 'header-colored';
    arrow.className = 'toTop';
  } else {
    console.log('here 2')
    header.className = 'header-transparent';
    arrow.className = 'toTop-transparent';
  }
};

小提琴：https://jsfiddle.net/zevane/zf8d4u36/

文档：https://developer.mozilla.org/en-US/docs/Web/API/Window/scrollY

为什么这个脚本不适用于Firefox？

1 个答案: