我的网站上有一个“介绍图片”,用户可以点击该图片,然后使用 anchor 将页面向下滚动到内容。嗯,不是每个人都点击链接,所以我希望页面在几秒钟后自动向下滚动到内容(如果用户没有点击 anchor 链接)。有什么方法可以使用 JS 或 CSS 来帮助我做到这一点吗?
最佳答案
目标区域是#info-content
。使用 setTimeout()
在一段时间后运行(运行时间为 5000 毫秒,或 5 秒 - 根据需要更改),并查看用户是否没有滚动($.scrollTop( ) == 0
),如果没有,滚动到目标区域。
setTimeout(function() {
if ($(window).scrollTop() == 0) {
$('html, body').animate({
scrollTop: $('#info-content').offset().top
},500,"swing");
}
},5000);
header,#info-content {
height: 300vh;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<header></header>
<section id="info-content">info-content</section>
关于javascript - 一段时间后转到带有 anchor 的内容,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/42560836/