0

我有这个网站，它有一个 100% 宽度的 div，距离页面顶部大约 700 像素。当用户向下滚动页面并到达菜单时，它会变为固定并保持在页面顶部，直到用户向上滚动。我已经实现了在http://jsbin.com/omanut/2上找到的这段代码：

    <script type="text/javascript">

    var fixit = document.querySelector('.topmenu');
    var origOffsetY = fixit.offsetTop;

    function onScroll(e) {
    window.scrollY >= origOffsetY ? fixit.classList.add('topfix') :
                              fixit.classList.remove('topfix');
    }

    document.addEventListener('scroll', onScroll);

    </script>

“topmenu”是我用于菜单栏 div 元素的唯一类。“topfix”是在一些 html <style> 标签中定义的类：

    <style>

    .topfix {
    position: fixed;
    top: 0;
    }

    </style>

如您所见，此代码将添加“topfix”作为相关 div 的类。所以我的 html 应该从 <div class="topmenu"> 更改为 <div class="topmenu topfix">。它在 Chrome 和 Firefox 上运行得非常好，但我不能让它在 IE 上运行。我是一个编程菜鸟，但我认为添加一个可以在 IE 上运行的事件侦听器可能会缺少一些东西。我将不胜感激。

--在一些答案之后，我对脚本进行了一些修改；它在 Chrome/FF 上很酷，但在 IE 上仍然不起作用，所以在这里你有它：

<script type="text/javascript">
var fixit = document.getElementsByTagName('div')[3];
var origOffsetY = fixit.offsetTop;

function onTopScroll(e) {
window.scrollY >= origOffsetY ? fixit.classList.add('topfix') :
                          fixit.classList.remove('topfix');
}
document.addEventListener('scroll', onTopScroll);
document.attachEvent('onscroll', onTopScroll);

</script>

我不确定 attachEvent 语法。任何进一步的帮助将不胜感激。

4

2 回答 2

1

尝试 IE 的 attachEvent 不是 addEventListener

于 2013-10-03T06:43:12.223 回答
1

你的IE是什么版本？document.querySelector()并非每个 IE 都支持。你可以使用getElementsByTagName和匹配特定的类，然后做你的事。

于 2013-10-03T07:00:20.697 回答