jQuery如何滚动到元素

0 投票
最新提问 1月 31, 2017 用户: Mercedes (470 分)

有一个input输入框:

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

然后还有一些其他元素,像其他文本输入,文本区域等。

当用户点击该id=subject的input时,页面自动地滚动到页面的最后一个元素(底部)。

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

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

动画效果最好稍慢、平滑。

我使用了最新的jQuery版本,想不利用任何插件,使用默认的jQuery功能来实现这一功能。

1个回答

0 投票
最新回答 1月 31, 2017 用户: snow (630 分)

可以参考下面的示例,点击最下面的按钮后平滑的滚动到顶端的div1。

<html>
    <script src="http://ajax.useso.com/ajax/libs/jquery/1.5.1/jquery.min.js" ></script>
    <!-- 国内的jquery镜像 -->
    <script>
        $(document).ready(function (){
            $("#click").click(function (){
                $('html, body').animate({
                    scrollTop: $("#div1").offset().top
                }, 2000);
            });
        });
    </script>
    <div id="div1" style="height: 1000px; width 100px; background-color:#ccc">
        Test 1
    </div>
    <br/>
    <div id="div2" style="height: 1000px; width 100px; background-color:#c0c">
        Test 2
    </div>
    <button id="click">点击滚动到顶部</button>
</html>
欢迎来到编程助手,编程方面有什么不懂的问题可以尽管在这里提问,你将会收到热心爱好者的回答。
...