做网站时很可能会用到文章页 sidebar 整个或某一个区块随着整个页面的滑动而固定在某个位置,以方便访客快捷操作。 那,这里就简单介绍一下使用 jquery 实现侧边栏随动。
代码语言:javascript
复制
var navH = $("#category-ct").offset().top;
$(window).scroll(function(){ //滚动条事件
var scroH = $(this).scrollTop(); //获取要随动的元素的滑动距离
//滚动条的滑动距离大于等于定位元素距离浏览器顶部的距离,就固定
if(scroH>=navH){
$("#category-ct").css({position: 'fixed'});
$("#category-ct").animate({top: '30px'},100);
}
else{
$("#category-ct").css({position: 'static',top:'0px'});
}
});