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. Dictionary在多线程情况下

    Add时出错 错误信息: Index was outside the bounds of the array. 详细信息: at System.Collections.Generic.Dictiona ...

  2. Android学习路-UI控件

  3. oracle存储过程与存储函数的区别和联系

    相同点:1.创建语法结构相似,都可以携带多个传入参数和传出参数.      2.都是一次编译,多次执行. 不同点:1.存储过程定义关键字用procedure,函数定义用function. 2.存储过程 ...

  4. vue生命周期简介

    vue生命周期简介 生命周期的钩子 LifeCycle hooks 上面已经能够清晰的看到vue2.0都包含了哪些生命周期的钩子函数~~ 那么 执行顺序以及什么时候执行,我们上代码来看~~~ 生命周期 ...

  5. as3.0影片简介失效，不阻碍下面影片简介的事件

    mast.mouseEnabled=false; mast.mouseChildren=false;

  6. undefined reference to symbol' pthread_create@@GLIBC_2.2.5'

    我在ubuntu16.04上迁移工程,遇到了这个错误. pthread库不是Linux系统默认的库,链接时需要添加-pthread参数. 这里注意是链接那一步添加-pthread,而不是编译选项.

  7. POJ-3278.CatchThatCow(数字BFS最短路输出)

    本题大意:一个农夫和一头牛在一个数轴上,牛不动,农夫每次可使自己的坐标 +1 , -1, *2 ,问最小需要多少次农夫与牛坐标相等. 本题思路:最短路,BFS. 本题代码: #include < ...

  8. Stealth潜行风格游戏源码(Unity5x)

    官方的Stealth画质看起来不错.Unity 官方说Stealth样例属于中等难度,通过学习Stealth,可以获得:   Create a fully functioning level of a ...

  9. 对于装office 365时，visio不兼容的解决

    先将office 365装好,之后从这个网址下载visio安装即可,但是没有 激活码,需要自己激活: 网址:链接: https://pan.baidu.com/s/1OqONPuJ0eumrpts-X ...

  10. Delphi: 圆形进度(环形进度)

    起源: 重回DC5项目,资源下载美工提供圆形进度条,复习Delphi,为实现其颇觉有趣,遂研究其. 最终效果图如下: 实现: 制作TCircleProgress控件,实现方法参照系统之TGauge控件 ...