function goTop(){
var _btn = document.getElementById("goTop");
if (document.documentElement && document.documentElement.scrollTop) {
var _con = document.documentElement;
}
else if (document.body) {
var _con = document.body;
}
window.onscroll = set;
_btn.style.left = "125px";
_btn.onclick = function() {
_btn.style.display = "none";
window.onscroll = null;
this.timer = setInterval(function() {
_con.scrollTop -= Math.ceil(_con.scrollTop * 0.3);
if (_con.scrollTop == 0) {
clearInterval(_btn.timer, window.onscroll = set);
}
}, 10);
};
function set() {
_btn.style.display = _con.scrollTop ? 'block': "none";
}
};
document.write("<div id=\"goTop\" style=\"font-size:12px; width:20px; height:55px; background:#0950A2; color:#fff; line-height:14px; position:fixed; bottom:30px; display:none; cursor:pointer; text-align:center; padding:5px 0; z-index:1; _position:absolute; _top:expression(eval(document.compatMode && document.compatMode == \'CSS1Compat\') ? documentElement.scrollTop + (documentElement.clientHeight - this.clientHeight) - 30 : document.body.scrollTop + (document.body.clientHeight - this.clientHeight) - 30);\">返回顶部</div>");
window.onscroll = goTop;

回到顶端js实现的更多相关文章

  1. js监听滚动条 回到顶端

    效果:当出现滚动条,且滚动条出现移动时,把回到顶端按钮 显示出来:当滚动条回到顶部时,将回到顶端按钮隐藏. <script type="text/javascript"> ...

  2. csdn回到顶端

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

  3. 回到顶端的jquery

    现在的淘宝啊,京东啊,各种网站都有一个功能,有一个按钮,在页面最顶端的时候不会显示,当往下拉到一定的时候会出现.点击他会直接跳到页面的顶端.代码如下: html代码: <div id=" ...

  4. 回到顶部js代码

    function go_to_top(){ //把内容滚动指定的像素数(第一个参数是向右滚动的像素数,第二个参数是向下滚动的像素数) window.scrollBy(0,-10); //延时递归调用, ...

  5. JS实现回到Top(顶部)--JavaScript

    当我们浏览一段很长的网页时,已经看到底部了,想回到顶部看前面的内容,可是需要滚动好几转鼠标滑轮或者拉动滚动条走好长“一段路”.这对于用户来说,体验效果是不够好的.如果我们借助简单的一个按钮,点击一下就 ...

  6. 自写jquery网页回到顶部效果,渐隐图标,引用js文件就可以

    唔.进来开发需求,当网页内容草鸡多的时候,用户就须要有个button高速回到顶部,而不是自己去滚滑轮~ 原本以为比較难的说,由于上头要求所实用js来实现,哪个页面引用,哪个页面显示. 于是乎,本屌丝就 ...

  7. JQuery 回到顶部效果

    图片,CSS/HTML/JS代码都在,可以直接用了. CSS代码 <style type="text/css"> #gs_feedback_gotop { _displ ...

  8. Selenium2+python自动化-使用JS脚本处理网页滚动条

    内容来自:https://www.cnblogs.com/yoyoketang/p/6128655.html JS相关知识:http://www.w3school.com.cn/js/index.as ...

  9. Node.js入门笔记(1):基本概念

    Node.js和JavaScript: 核心都是ECMAScrit,比如数据类型,语法结构,内置对象等等. 但是在js中顶层是window 在node中的不存在这个window(console.log ...

随机推荐

  1. Hibernate中saveOrUpdate()和merge()的区别

    this.getSession().merge(obj); this.getSession().saveOrUpdate(obj); saveOrUpdate(): saveOrUpdate()基本上 ...

  2. [No000003]现代版三十六计,计计教你如何做人

    <现代版三十六计,计计教你如何做人> …………………………………………………………………………………… 第1计施恩计 在人际交往中,见到给人帮忙的机会,要立马扑上去,像一只饥饿的松鼠扑向地 ...

  3. django复习笔记3:urls/views/templates三板斧

    0.先看看文件结构 mysite/ mysite/ ├── __pycache__ │   └── manage.cpython-.pyc ├── blog │   ├── __init__.py │ ...

  4. iOS多线程杂论

    iOS多线程的分布 (1) NSThread (2) NSOperation (3) GCD 现在对下面三个进行一个个的分析,希望那里说得不对的地方希望简友们帮我指点一二. 1,NSThread 优点 ...

  5. C#.NET 大型通用信息化系统集成快速开发平台 4.0 版本 - 独立子系统管理员功能实现

    1: 由于公司一次性要开发10多个子系统,每个子系统都需要有相关的业务部门进行对应.2: 若用集中式管理方式,每个业务部门人员变动,权限变动时,都需要早IT信息中心进行调整,影响工作效率.及时性.3: ...

  6. 前端见微知著番外篇:GIT舍我其谁?

    在上一篇中,我们讲到了利用纯UI的软件如何实现代码的提交.但是在MAC机器上,是没有turtoiseGit这类软件的,所以利用命令行的方式就是我们的首选了. 下面我们来描述两种主要的Git使用场景: ...

  7. centos6-honeyd安装&配置

    安装 需要装 libpcap libevent libdnet 等(!) 有些用的yum,有些下载的安装包手动安装 (wget tar configure make install 非常linux) ...

  8. 解决Package illuminate/html is abandoned, you should avoid using it. Use laravelcollective/html instead.问题

    解决步骤: 1.分析问题是因为laravel5.1不赞成使用illuminate/html而推荐使用laravelcollective/html包,所以我们利用composer命令移除illumina ...

  9. 微信公众平台SDK

    微信公众平台网址:https://mp.weixin.qq.com/ 服务号说明:给企业和组织提供更强大的业务服务与用户管理能力,帮助企业快速实现全新的公众号服务平台. .NETSDK: Loogn. ...

  10. KM模板

    var n,m,i,j:longint; ans:int64; sel,lx,ly,slack:..] of int64; a:..,..] of int64; visx,visy:..] of bo ...