gpt4 book ai didi

javascript - 获取 window.scrollby 的结尾

转载 作者:太空宇宙 更新时间:2023-11-04 07:18:53 25 4
gpt4 key购买 nike

我想实现一个持续滚动的页面,这样当它到达页面底部时,它会返回顶部并滚动回末尾。到目前为止我已经实现了页面

$(document).ready(function() {
var scroll = setInterval(function() {
window.scrollBy(0, 1);
}, 20);
});
.content {
height: 500px;
width: 100%;
background-color: #cccccc;
}

.inner-content {
height: 80px;
width: 100%;
margin: 10px 0 10px 0;
background-color: #ff00ff;
}

h1 {
text-align: center;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />

<div class="row content">
<div class="col-md-12 inner-content">
<h1>One</h1>
</div>
<div class="col-md-12 inner-content">
<h1>Two</h1>
</div>
<div class="col-md-12 inner-content">
<h1>Three</h1>
</div>
<div class="col-md-12 inner-content">
<h1>Four</h1>
</div>
<div class="col-md-12 inner-content">
<h1>Five</h1>
</div>
</div>

现在,我想弄清楚的是如何在 JS 到达页面底部时收听它,以便我可以再次从顶部重新初始化自动滚动。请帮忙。

最佳答案

您可以使用以下代码测试窗口是否位于底部:

 $(window).scroll(function() {
if ( $(window).scrollTop() + $(window).height() == $(document).height() ) {
$(window).scrollTop(0);
}
});

滚动时,我们测试页面是否在底部,然后将滚动位置重置为 0(顶部)

https://jsfiddle.net/qjvkgx9t/

关于javascript - 获取 window.scrollby 的结尾,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50514026/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com