我正在添加一个“粘性滚动”导航,我认为它被称为,它允许导航移动,直到它到达浏览器顶部并固定,即始终保持在用户的视线中。我已经设法让它在 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
有任何想法吗?
谢谢