文章/答案/技术大牛

发布

社区首页 >问答首页 >JQuery动画在火狐中不起作用

问JQuery动画在火狐中不起作用
EN

Stack Overflow用户

提问于 2014-05-15 01:56:40

回答 1查看 1.5K关注 0票数 1

我有Jquery脚本在一个页面上播放导航栏动画，在另一个页面上禁用它。它可以在chrome上运行，但不能在firefox上运行。下面是我的代码：

var URL = window.location.pathname;
URL = URL.split("/");
if(URL[1] != 'holiday') {
    $('.navbar').addClass('hide-menu');
    $(window).scroll(function() {
        slider();
    });
} else {
    $(".navbar").addClass('show-menu');
}

滑块函数：

function slider() {
    if (document.body.scrollTop > 500)
        $('.navbar').stop().animate({
            "margin-top" : '0'
        });
    else
        $('.navbar').stop().animate({
            "margin-top" : '-150px'
        });
}

CSS：

.show-menu {
    margin-top: 0px; 
}
.hide-menu {
    margin-top: -150px;
}

Firefox隐藏菜单，但它无法播放动画和显示菜单。有什么建议吗伙计们？谢谢

jquery

css

firefox

javascript

回答 1

Stack Overflow用户

发布于 2014-05-15 02:28:40

您必须从实际具有滚动条的元素中获取滚动量。火狐认为这就是<html>元素。

您可以将所有内容包装在设置了overflow: auto的容器中，然后将其用作检查滚动数量以及放置scroll事件处理程序的位置。Here's a jsbin.

<body>
  <div id=everything>
    <div class=navbar>
      HELLO WORLD
    </div>
    <!-- content ... -->
  </div>
</body>

和CSS：

html, body { height: 100%; padding: 0; margin: 0; }

#everything { height: 100%; overflow: auto; }

票数 1

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/23661782

复制

相似问题

问JQuery动画在火狐中不起作用
EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JQuery动画在火狐中不起作用EN

回答 1

Stack Overflow用户

社区

活动

圈层

关于

腾讯云开发者

热门产品

热门推荐

更多推荐

问JQuery动画在火狐中不起作用
EN