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. encodeURI & encodeURIComponent

    [encodeURI & encodeURIComponent]  区别在于,"&", "+", 和 "=" 不会被enco ...

  2. Unity中的四个路径

    Application.database:当前工程的Assets文件夹(编辑器) Application.StreamingAssets:IO流路径 当前工程的StreamingAssets文件夹(编 ...

  3. JMeter3.0（三十八）图形化HTML报告中文乱码问题处理（转载）

    转载自 http://www.cnblogs.com/yangxia-test 由于个人在JMeter 3.0的实际应用中,脚本中的Test Plan/Sampler等元件命名都没有使用中文,所以在之 ...

  4. Pandas基本功能之选取索引和过滤

    索引.选取和过滤 大部分的查询用法 类型 说明 obj[val] 选取DataFrame的单个列或一组列 obj.ix[val] 选取DataFrame的单个行或一组行 obj.ix[:,val] 选 ...

  5. 【pyspider】启动爬虫后在results页面没有看到结果

    今天根据书上的介绍写了一个简单爬虫,爬取豌豆荚里面APP的基本信息,但是在调试结果正常后,发现跳转到result页面后没有看到结果. 后来上网查了一下,发现要在def detail_page(self ...

  6. 截图软件FastStone

    屏幕截图软件(FastStone Capture) 好用,可以粘贴 / 复制. 可以做页面设计,有屏幕标尺,取色器.

  7. jquery使用FormData提交数据

    在jquery中,使用ajax提交表单数据. FormData可以很方便地获取到表单中的所有数据. 注意: ajax中的data参数为FormData类型时,contentType就不要设置成appl ...

  8. 数据库与ORM

    一.数据库的配置 1 django默认支持sqlite,mysql, oracle,postgresql数据库.  <1> sqlite django默认使用sqlite的数据库,默认自带 ...

  9. 154. Find Minimum in Rotated Sorted Array II (Array; Divide-and-Conquer)

    Suppose an array sorted in ascending order is rotated at some pivot unknown to you beforehand. (i.e. ...

  10. js正则表达式中的正向肯定预查和正向否定预查

    对于没有使用过这几个表达式的人,应该对这个概念都有点不太理解,下面就以实际例子说明这几个表达式的用户. 一.?:pattern——匹配检验:会作为匹配校验,是一个非获取匹配,并出现在匹配字符结果里面, ...