1

我正在添加一个“粘性滚动”导航,我认为它被称为,它允许导航移动,直到它到达浏览器顶部并固定,即始终保持在用户的视线中。我已经设法让它在 chrome、firefox 和 IE 中运行。

然而,jquery 的一部分允许您更改它停止的上边距。

无论如何我可以为每个浏览器设置不同的上边距,例如,chrome我希望它是10px,而IE我希望它是5px,firefox出于某种原因将整个屏幕与Nav一起使用,所以它不需要更改。

这是它的Jquery

<script type="text/javascript">
    $(function(){ // document ready

      if (!!$('.sticky').offset()) { // make sure ".sticky" element exists

        var stickyTop = $('.sticky').offset().top; // returns number 

        $(window).scroll(function(){ // scroll event

          var windowTop = $(window).scrollTop(); // returns number 

          if (stickyTop < windowTop){
            $('.sticky').css({ position: 'fixed', top: 0 });
          }
          else {
            $('.sticky').css('position','static');
          }

        });

      }

    });
</script>

你可以看到上边距部分 top: 0

有任何想法吗?

谢谢

4

1 回答 1

2

如果你想走这条路,你可以使用 $.browser ( http://api.jquery.com/jQuery.browser/ ) 来测试用户正在使用哪个浏览器。这在大多数情况下都有效,但如果用户更改了浏览器的用户代理设置,它可能会崩溃。

然而,我建议你做的是找出这种行为存在的原因并出售潜在的问题。如果你无法修复它或者你已经没有时间了,你总是可以退回到像 $.browser 这样的黑客。:)

于 2012-04-08T09:33:37.207 回答