控制按钮下拉到达一定距离时显示,返回顶层时消失,用JS中的延时定时器来模拟滚动条效果

<script type="text/javascript">
  window.onscroll=function(){
  //获取当前页面的滚动条纵坐标位置
    if(document.documentElement.scrollTop || document.body.scrollTop > 200){
      document.getElementById("top").style.display = "block";
      }else{
      document.getElementById("top").style.display = "none";
    }
  }
  function upScroll(){
    window.scrollBy(0,-80);//用scrollby来设定滚动条滑动的像素数
    var timerUp = setTimeout("upScroll()",50);//启动定时器
    var upFinish = document.documentElement.scrollTop || document.body.scrollTop;//获取页面高度
    if(upFinish == 0){
      clearTimeout(timerUp);//停止定时器
    }
  }
</script>

Javascript返回顶部的更多相关文章

  1. javascript返回顶部几种代码总结

    纯js代码 /** * 回到页面顶部 * @param acceleration 加速度 * @param time 时间间隔 (毫秒) **/ function goTop(acceleration ...

  2. javascript返回顶部插件+源码

    javascript插件->returnTop.js: /* ** 插件名称returnTop.js ** 调用返回头部单例参数说明 ** 调用方式:turn.init(ele,speed); ...

  3. JavaScript返回顶部特效

    样式: <style type="text/css"> /*返回顶部特效*/ a { border: none; text-decoration: none; outl ...

  4. 写一个JavaScript“返回顶部”功能

    在web页面中,如果页面较高,为了方便用户快速地返回顶部,都会添加一个返回顶部按钮. 效果演示可以查看本页.如果页面有滚动高度,右下角就会有一个含有“返回顶部”字样的黑色背景半透明的小条条.点击这里“ ...

  5. javascript 返回顶部

    <style> #linGoTopBtn {    POSITION: fixed; TEXT-ALIGN: center; LINE-HEIGHT: 30px; WIDTH: 30px; ...

  6. 【JavaScript&jQuery】返回顶部

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  7. gotop(返回顶部)

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. 使用Javascript实现返回顶部功能。

    为了提高网站的浏览体验及友好度,相信大部分网站需要一个返回顶部的按钮,如果使用传统的a标记,再做一个div加上链接的话,非常麻烦,不仅每个页面都需要添加,而且不能实现非常智能的效果及简化维护时间. 下 ...

  9. JavaScript之返回顶部

    为了弄这个Hexo,今天又是坐在电脑面前待了一天( ⊙ o ⊙ ),老是出问题,在百度上也试验了很多方法,还是没弄好,诶...身心疲惫甚是乏累啊~~~ 算了,这个Hexo先不弄,还是安分点吧,在Hex ...

随机推荐

  1. python多线程机制

    Python中的线程从一开始就是操作系统的原生线程.而Python虚拟机也同样使用一个全局解释器锁(Global Interpreter Lock,GIL)来互斥线程多Python虚拟机的使用. GI ...

  2. 提升ReSharper和Visual Studio的性能

    转载 作者:赵青青        出处:http://www.cnblogs.com/zhaoqingqing/ 文章目录[点击展开](?)[+]   提升性能 我们不断地确保ReSharper的正常 ...

  3. [置顶] 步步辨析JS中的对象成员

    前提 首先我们应该明白创建一个JS对象的具体实例是实例化的过程,而实例化是通过new关键字实现的,这个对象是含有constructor的,一般的核心对象都会具有constructor以便创建其实例.因 ...

  4. static作用——The static effect

    1)在函数体内,一个被声明为静态的变量在这一函数被调用过程中维持其值不变(该变量存放在静态变量区). 2) 在模块内(但在函数体外),一个被声明为静态的变量可以被模块内所用函数访问,但不能被模块外其它 ...

  5. TCP/IP之分层

    网络协议通常分不同层次进行开发,每一层分别负责不同的通信功能.一个协议族,比方T C P / I P,是一组不同层次上的多个协议的组合.T C P / I P通常被觉得是一个四层协议系统. 1.每层的 ...

  6. Eclipse debug经常使用基本技巧

    1.F5单步调试,步入,进入函数体内部 2.F6单步调试.步过.不进入函数体 3.F7返回 4.F8运行到最后 5.退出时.右键点击右上角Debug选择退出就可以 $(function () { $( ...

  7. Qt国际化详细介绍,中文乱码以及解决方案

    Qt国际化的一般步骤 运行 lupdate,从应用程序的代码中提取所有界面上的可见字符.        这些可见字符必须被 tr() .QCoreApplication::translate().Qt ...

  8. JDK5-静态导入

    import static 1. 导入一个类内所有静态成员 import static java.lang.Math.*; public class StaticImport { public sta ...

  9. Linux防火墙配置

    防火墙命令 service iptables stop --停止 service iptables start --启动文件  /etc/sysconfig/iptables # Firewall c ...

  10. 【算法】最长公共子序列(nlogn)

    转载注明出处:http://blog.csdn.net/wdq347/article/details/9001005 (修正了一些错误,并自己重写了代码) 最长公共子序列(LCS)最常见的算法是时间复 ...