我有这个JS代码,我用它来添加和删除一个类,同时从页面顶部向下滚动,但我想做的是,也消失时,你接近年底的页面或回到原来的状态后,一些滚动(从右:7px至右侧:-150px,例如).我复制了相同的JS代码,并改变了scrollTop > scrollBottom
,它不工作.
jQuery(document).on('scroll', (e) => {
if (document.body.scrollTop > 120 || document.documentElement.scrollTop > 350) {
console.log('now');
jQuery('.ast-below-header-bar').addClass('filterr');
} else {
console.log('no');
jQuery('.ast-below-header-bar').removeClass('filterr');
}
})
body {
height: 500vh
}
.ast-below-header-bar {
display: grid;
position: fixed;
right: -150px;
top: 14%;
background: red;
height: 200px;
width: 200px;
transition: .3s;
}
.ast-below-header-bar.filterr {
right: 7px!important;
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div class="ast-below-header-bar"></div>
1条答案
按热度按时间ilmyapht1#
您可以使用
window.innerHeight
在滚动条底部执行计算。根据您的需要调整它。