gpt4 book ai didi

javascript - 使用 jQuery 滚动到某个元素

转载 作者:行者123 更新时间:2023-11-28 08:02:24 25 4
gpt4 key购买 nike

我有这个input元素:

  <input type="text" class="textfield" value="" id="subject" name="subject">

然后我还有一些其他元素,例如其他标签的 & <textarea>标签等...

当用户单击<input id="#subject">时,页面应该滚动到页面的最后一个元素,并且应该使用漂亮的动画(应该滚动到底部而不是顶部)

页面的最后一项是 submit按钮 #submit :

<input type="submit" class="submit" id="submit" name="submit" value="Ok, Done.">

动画不应该太快并且应该流畅。

我正在运行最新的 jQuery 版本。我更喜欢不安装任何插件,而是使用默认的 jQuery 功能来实现此目的。

最佳答案

假设您有一个 id button 的按钮,请尝试以下示例:

$("#button").click(function() {
$([document.documentElement, document.body]).animate({
scrollTop: $("#elementtoScrollToID").offset().top
}, 2000);
});

我从文章 Smoothly scroll to an element without a jQuery plugin 中获取了代码。我已经在下面的示例中对其进行了测试。

<html>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script>
$(document).ready(function (){
$("#click").click(function (){
$('html, body').animate({
scrollTop: $("#div1").offset().top
}, 2000);
});
});
</script>
<div id="div1" style="height: 1000px; width 100px">
Test
</div>
<br/>
<div id="div2" style="height: 1000px; width 100px">
Test 2
</div>
<button id="click">Click me</button>
</html>

关于javascript - 使用 jQuery 滚动到某个元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25233980/

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