gpt4 book ai didi

javascript - 如何使用 jQuery 滚动到我的单个页面的顶部?

转载 作者:行者123 更新时间:2023-11-28 00:50:14 24 4
gpt4 key购买 nike

我在 onAppend 函数中使用以下代码滚动到任何页面的顶部。

在单击播放按钮并且开始加载 youtube vid 后应该触发滚动 - 该函数有一个 onAppend 事件,它工作正常......

所以我只需要滚动功能。现在,我尝试将此代码仅用于我所有的单个 Wordpress 帖子。

编辑: jQuery scroll to element 上的解决方案在这种情况下不起作用。所以应该忽略“可能重复”的请求。

var body = jQuery("html, body");
body.stop().animate({scrollTop:0}, 500, function() {
// alert("Finished animating");
});

单个帖子的 HTML 看起来像

<html prefix="og: http://ogp.me/ns#" lang="en-US">
<head>...</head>
<body class="post-template-default single single-post postid-880">
<nav id="menu" class="xs-menu">....</nav>
<div id="single-post-wrapper" class="single-post-class">
...
</div>
</body>
</html>

知道如何只滚动到 Wordpress 中单个帖子的顶部 - 例如滚动到 #single-post-wrapper 或整个帖子的顶部吗?

最佳答案

您可以通过将元素的顶部窗口偏移量传递为 $(selector).offset().top

来滚动到该元素

查看此工作片段

$(".stop").on("click",function(e){
$('html, body').animate({
scrollTop:0}, 'slow');
});


$(".spost").on("click",function(e){
$('html, body').animate({
scrollTop:$("#single-post-wrapper").offset().top
}, 'slow');
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="body">
<button class="stop">scroll to top</button>
<button class="spost">scroll to single-post-wrapper</button>

<div class="post-template-default single single-post postid-880">
<nav id="menu" class="xs-menu">menu</nav>
<br><br><br><br><br>
<div id="single-post-wrapper" class="single-post-class">
single-post-wrapper<button class="stop">scroll to top</button> <br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text<br>text
</div>
</div>


<button class="stop">scroll to top</button>
<button class="spost">scroll to single-post-wrapper</button>

</div>

关于javascript - 如何使用 jQuery 滚动到我的单个页面的顶部?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47907311/

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