scrollTop属性表示被隐藏在内容区域上方的像素数。元素未滚动时，scrollTop的值为0，如果元素被垂直滚动了，scrollTop的值大于0，且表示元素上方不可见内容的像素宽度

　　由于scrollTop是可写的，可以利用scrollTop来实现回到顶部的功能

　　[注意]关于页面的scrollTop的兼容问题详细内容移步至此

<body style="height:2000px;">

<button id="test" style="position:fixed;right:0;bottom:0">回到顶部</button>

<script>

test.onclick = function(){

document.body.scrollTop = document.documentElement.scrollTop = 0;

}

</script>

</body>

使用scrollTop返回顶部的更多相关文章

  1. js返回顶部

    1. function scrollTop(){ $(},); } 2. $("#side-bar .gotop").click(function(){ $(},); //返回顶部 ...

  2. zepto的返回顶部scrollTop的动画解决方法

    写移动端的时候,引入的zepto.js里的animate不包括scrollTop,所以返回顶部的时候,没有动画的效果.这里我使用的是setInterval的方法.代码详情如下 <!DOCTYPE ...

  3. js小效果：返回顶部 scrollTop 。 滚屏：animate

    返回顶部: (scroll 滚屏事件,如果超出第一屏,显示返回顶部的按钮) <div id="gotop" onclick="javascript:scroll(0 ...

  4. JS——BOM操作（点击按钮返回顶部案例：scrollTop的用法）

    点击按钮返回顶部案例: 代码如下: <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

  5. 返回顶部的功能 div固定在页面位置不变

    1.你在网上搜索的时候,可能会搜索到div固定在页面上,不随滚动条滚动而滚动是用CSS写的,写法是position:fixed;bottom:0; 但是这个在iframe满地跑的页面实际开发中,有啥用 ...

  6. jquery 返回顶部 兼容web移动

    返回顶部图片 http://hovertree.com/texiao/mobile/6/tophovertree.gif 具体实现代码 <span id="tophovertree&q ...

  7. zepto返回顶部动画

    点击返回顶部 function goTop(acceleration, time) { acceleration = acceleration || 0.1; time = time || 16; v ...

  8. js实现返回顶部功能的解决方案

    很多网站上都有返回顶部的效果,主要有如下几种解决方案. 1.纯js,无动画版本 window.scrollTo(x-coord, y-coord); window.scrollTo(0,0); 2.纯 ...

  9. js返回顶部效果

    当用户浏览的网页过于长的时候,用户在浏览到网页底部想要在返回顶部需要滚动好几次滚轮才能返回顶部,不仅麻烦,而且用户体验也会很差.现在的大多是页面都会在页面顶部或者是页面的可见区域的某一位置固定一个按钮 ...

随机推荐

  1. MySQL实现中文拼音排序

    MySQL下新建一个表,默认采用utf8字符集,中文不能直接按照拼音进行排序. 例如以下语句: SELECT * FROM `tb_fixedassets` order by C_FANAME 得到的 ...

  2. metasploit framework（二）：记一次入侵

    msfconsole use 其中一个 exploit前台执行注入 后台执行shell 加-j 通过sessions查看后台执行的shell,可以看到这个会话的id号为2 进入会话,sessions ...

  3. javax.servlet.http.HttpServletResponse.getStatus()I

    感谢作者分享:http://blog.csdn.net/szwangdf/article/details/42145463 -------------------------------------- ...

  4. django通过添加session来保存公共变量

    有时候我们需要所有页面都使用同一个变量,比如用户登录信息.那不可能render每一个页面时都去传递一个变量,会非常麻烦 而用session可以解决这个问题   web的session可以通过reque ...

  5. 七：python 对象类型详解三：列表

    一:列表简介: 1,列表可以包含任何种类的对象:数字.字符串甚至集合对象类型.列表都是可变对象,它们都支持在原处修改的操作,可以通过指定的偏移量和分片.列表方法调用.删除语句等方法来实现.关键的作用有 ...

  6. vue使用全局element-ui组件

    安装loader模块: cnpm install style-loader -D cnpm install css-loader -D cnpm install file-loader -D   安装 ...

  7. Python os.sep（）

    os.sep是什么 python是跨平台的.在Windows上,文件的路径分隔符是'\',在Linux上是'/'. 为了让代码在不同的平台上都能运行,那么路径应该写'\'还是'/'呢? 使用os.se ...

  8. python爬虫相关基础概念

    什么是爬虫 爬虫就是通过编写程序模拟浏览器上网,然后让其去互联网上抓取数据的过程. 哪些语言可以实现爬虫 1.php:可以实现爬虫.但是php在实现爬虫中支持多线程和多进程方面做得不好. 2.java ...

  9. Mac上反编译Android apk安装包

    什么是反编译 我们知道,Android的程序打包后会生成一个APK文件,这个文件可以直接安装到任何Android手机上,因此,反编译就是对这个APK进行反编译.Android的反编译分成两个部分: 一 ...

  10. MySQL的四种不同查询的分析

    1.前置条件: 本次是基于小数据量,且数据块在一个页中的最理想情况进行分析,可能无具体的实际意义,但是可以借鉴到各种复杂条件下,因为原理是相同的,知小见大,见微知著! 打开语句分析并确认是否已经打开 ...