×

用JS实现滚动[scrollTo]到页面顶部

作者:andy0012019.10.12来源:Web前端之家浏览:5989评论:0
关键词:scrollTo

在滚动页面中如何使用JavaScript滚动到页面顶部?

在JavaScript中可以使用window.scrollTo()在滚动页面中滚动到页面顶部,scrollTo() 方法可把内容滚动到指定的坐标。

window接口的scrollTo()方法可用于滚动到页面上的指定位置。它接受要滚动到的页面的x和y坐标的两个参数。以0的形式传递这两个参数将滚动页面到最上面和最左边的点。

语法:

window.scrollTo(x-coordinate, y-coordinate)

DEMO

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style> 
    .scroll { 
        height: 1000px; 
        background-color: lightgreen; 
    }
</style> 

</head>

<h2 style="color: green">使用JavaScript滚动到页面顶部</h2> 
    <p>单击按钮,滚动到页面顶部</p> 
    
    <p class="scroll">这里一段测试文本!这里一段测试文本!这里一段测试文本!</p> 
    
    <button onclick="scrollToTop()">单击,滚动到顶部</button> 
    <script> 
        function scrollToTop() { 
            window.scrollTo(0, 0); 
        } 
    </script> 
</body> 
  
</html>

温馨提示:本文作者系 ,经Web前端之家编辑修改或补充,转载请注明出处和本文链接:
http://www.miarww.com.cn/article/scrollTo234235423523.html

网友评论文明上网理性发言 已有0人参与

发表评论:

最新留言

首页|JavaScript|HTML|HTML4|HTML5|CSS3|开发工具|性能优化|移动开发|前端教程|性能优化|开发工具|酷站欣赏|UI设计|前端教程

Copyright ? 2020 Web前端之家(www.miarww.com.cn) 版权所有 All Rights Reserved.
粤ICP备12067512号-1

Copyright Your WebSite.Some Rights Reserved.

Powered By Z-BlogPHP 1.6.0 Valyria

时时彩平台哪个好 注册免费送彩金捕鱼 云南快乐十分20分走势图 黑龙江36选7福利彩票开奖查询 奇趣腾讯分分彩走势图app 王中王精选4肖中特 广东闲来麻将 贵州11选5* 河南十一选五开奖分布图 棋牌龙王捕鱼 重庆荣昌三人血战麻将 老快3形态走势图 幸运农场水果走势图 好运来平肖平码论坛 开元棋牌里有赢钱的吗 内蒙古快三历史走势图 1分彩是不是有人控制