收集篇(已测)--

<html>
<head>
<script type="text/javascript">
var currentPosition,timer;
var speed=10;
function GoTop(){
timer=setInterval("runToTop()",1);
}
function runToTop(){
currentPosition=document.documentElement.scrollTop || document.body.scrollTop;
currentPosition-=speed; //speed变量
if(currentPosition>0)
{
window.scrollTo(0,currentPosition);
}
else
{
window.scrollTo(0,0);
clearInterval(timer);
}
}
</script>
<style type="text/css">
</style>
</head>
<body>
<div style="height:1000px;text-align:center;font-size:200px;font-weight:bold;">饭</div>
<div style="height:1000px;text-align:center;font-size:200px;font-weight:bold;">吃</div>
<div style="height:1000px;text-align:center;font-size:200px;font-weight:bold;">家</div>
<div style="height:1000px;text-align:center;font-size:200px;font-weight:bold;">回</div>
<div style="height:1000px;text-align:center;font-size:200px;font-weight:bold;">你</div>
<div style="height:1000px;text-align:center;font-size:200px;font-weight:bold;">带</div>
<div id="back-up" onclick="GoTop()" style="border:1px solid red;height:100px;width:15px;position:fixed;cursor:pointer;right:10px;bottom:30px;">返回顶部</div>
<script>
window.scrollTo(0,document.body.scrollHeight);
</script>
</body>
</html>

js实例--js滚动条缓慢滚动到顶部的更多相关文章

  1. js实现点击按钮滚动条缓慢滚动到顶部

    toTop:function(){ //toTop 滚动到顶部 var currentPosition,timer; var speed=10; timer=setInterval(function( ...

  2. js控制div滚动条,滚动滚动条使div中的元素可见并居中

    1.html代码如下 <div id="panel"> <div id="div1"></div> <div id=& ...

  3. vue中使用vue-router切换页面时滚动条自动滚动到顶部的方法

    原文:http://www.jb51.net/article/129270.htm main.js入口文件配合vue-router写这个 router.afterEach((to,from,next) ...

  4. [HTML/JS] JQuery 页面滚动回到顶部

    HTML: <html> <body> <div id="back-to-top" style="cursor:pointer; displ ...

  5. js平滑滚动到顶部,底部,指定地方

    [原文链接] 采用锚点进行页面中的跳转的确很方便,但是要想增加网页的效果,可以使用jquery中的animate,实现滚动的一个动作,慢慢的滚动到你想跳转到的位置,从而看起来会非常高大上. [示例演示 ...

  6. JS 实现DIV 滚动至顶部后固定

    JS 实现DIV 滚动至顶部后固定 <!DOCTYPE HTML> <html> <head> <meta charset="UTF-8" ...

  7. [js常用]页面滚动的顶部,指定位置或底部,平滑滚动

    js平滑滚动到顶部.底部.指定地方 <!DOCTYPE html> <html lang="en"> <head> <meta chars ...

  8. 2018年 js 简易控制滚动条滚动的简单方法

    首先是es2015 的新api Element.scrollIntoView() // 滚动到最上方 等同于 dom.scrollIntoView(true) Element.scrollIntoVi ...

  9. JS DIV列表自动滚动带停顿,滚动到底部后自动滚动到顶部

    setInterval -- 间隔执行函数:element.scrollTop -- 元素滚动条距头部的距离: 因为执行代码需要时间,所以最终动态时间会比设置的要慢 var slide = new S ...

随机推荐

  1. 【BJG吐槽汇】第2期 - 我每周1-2次迟到都是因为你-->ios10!

    本期槽点嘉宾:苹果系统 ios10 小吐我记得iphone是在2008年出的,当时我还在用诺基亚N70,对iphone是十分的陌生,想必大家也是,直到iphone4的时候,黄牛成群,饥饿营销,包括出i ...

  2. OpenH264

    转自:http://blog.csdn.net/chinabinlang/article/details/41209053 目前最常用的264工程师x264: 最近有又有一个开源工程OpenH264, ...

  3. bzoj1298题解

    [题意分析] 要求设计一组n个m面的骰子,使每一个骰子i对骰子a[i]的胜率都大于50%. [算法分析] 对于每个i,连一条从i指向a[i]的边,那么题目给出的关系构成了一个有向基环树森林. 对于树上 ...

  4. SqlDataReader中的GetSqlValue()方法

    sdr.GetValue(0) "Title"sdr.GetValue(1)4sdr.GetValue(2)falsesdr.GetValue(3)0sdr.GetValue(4) ...

  5. JavaScript HTML DOM 元素(节点)

    添加和删除节点(HTML 元素) 创建新的 HTML 元素  如需向 HTML DOM 添加新元素,您必须首先创建该元素(元素节点),然后向一个已存在的元素追加该元素. 例如:这段代码创建新的 < ...

  6. c#:readonly与const的区别

    readonly与const的区别: 1.初始化:const  字段只能在该字段的声明中初始化. readonly  字段可以在声明或构造函数中初始化. 2.值: const 字段是编译时常量(con ...

  7. volatile(C# 参考)

    本文档已存档,并且将不进行维护. volatile(C# 参考) 若要了解有关 Visual Studio 2017 RC 的最新文档,请参阅 Visual Studio 2017 RC 文档. vo ...

  8. strutsprepareAndExecuteFiter

    FilterDispatcher是早期struts2的过滤器,后期的都用StrutsPrepareAndExecuteFilter了,如 2.1.6.2.1.8.StrutsPrepareAndExe ...

  9. PhpSrom安装xdebug

    1.php需要安装xdebug,这样能支持调试. 下载地址:http://www.xdebug.org/download.php,若不清楚下载版本,可将phpinfo的信息复制到下载地址页面的cust ...

  10. Symfony命令大全

    执行命令: $ php bin/console 查看一下命令 Symfony version 3.1.5 - app/dev/debug Usage: command [options] [argum ...