电商详情滚动条监听
最后更新于:2022-04-01 23:51:09
[TOC]
电商网站详情/评论区域滚动条监听
css
.setbar{
width:1200px;
position:relative;
left:0;
margin: 20px auto 0 auto;
z-index: 99999998;
}
.fixed{
position: fixed;
top: 0;
left: 0;
z-index: 100000010;
margin: 0 auto;
width: 100%!important;
}
html
<div class="setbar"></div>
JS
<script type="text/javascript">
var top1=$(".setbar").offset().top;
$(window).scroll(function(){
var win_top=$(this).scrollTop();//获取当前页面高度
var top=$(".setbar").offset().top;//获取该div距顶部的高度
if(win_top>=top){
$(".setbar").addClass("fixeds");
}//如果此处用else判断来remove sfixed这个类的话是不行的,因为当加上这个类的时候,win_top与top值就一直相等了;只有与以前的距离做比较才能实现滑上去的时候能回到原来的位置。
if(win_top<top1){
$(".setbar").removeClass("fixeds");
}
})
</script>