回到顶端js实现
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实现的更多相关文章
- js监听滚动条 回到顶端
效果:当出现滚动条,且滚动条出现移动时,把回到顶端按钮 显示出来:当滚动条回到顶部时,将回到顶端按钮隐藏. <script type="text/javascript"> ...
- csdn回到顶端
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 回到顶端的jquery
现在的淘宝啊,京东啊,各种网站都有一个功能,有一个按钮,在页面最顶端的时候不会显示,当往下拉到一定的时候会出现.点击他会直接跳到页面的顶端.代码如下: html代码: <div id=" ...
- 回到顶部js代码
function go_to_top(){ //把内容滚动指定的像素数(第一个参数是向右滚动的像素数,第二个参数是向下滚动的像素数) window.scrollBy(0,-10); //延时递归调用, ...
- JS实现回到Top(顶部)--JavaScript
当我们浏览一段很长的网页时,已经看到底部了,想回到顶部看前面的内容,可是需要滚动好几转鼠标滑轮或者拉动滚动条走好长“一段路”.这对于用户来说,体验效果是不够好的.如果我们借助简单的一个按钮,点击一下就 ...
- 自写jquery网页回到顶部效果,渐隐图标,引用js文件就可以
唔.进来开发需求,当网页内容草鸡多的时候,用户就须要有个button高速回到顶部,而不是自己去滚滑轮~ 原本以为比較难的说,由于上头要求所实用js来实现,哪个页面引用,哪个页面显示. 于是乎,本屌丝就 ...
- JQuery 回到顶部效果
图片,CSS/HTML/JS代码都在,可以直接用了. CSS代码 <style type="text/css"> #gs_feedback_gotop { _displ ...
- Selenium2+python自动化-使用JS脚本处理网页滚动条
内容来自:https://www.cnblogs.com/yoyoketang/p/6128655.html JS相关知识:http://www.w3school.com.cn/js/index.as ...
- Node.js入门笔记(1):基本概念
Node.js和JavaScript: 核心都是ECMAScrit,比如数据类型,语法结构,内置对象等等. 但是在js中顶层是window 在node中的不存在这个window(console.log ...
随机推荐
- 嵌入式linux根文件系统制作
编译Busybox 从http://www.busybox.net/downloads/下载busybox工具.这里我们下载的上最新版: busybox-1.24.2.tar.bz2 解压Busybo ...
- 由于启动用户实例的进程时出错,导致无法生成 SQL Server 的用户实例。该连接将关闭。
错误:由于启动用户实例的进程时出错,导致无法生成SQL Server的用户实例. 原因:添加安装SQLEXPRESS时,估计装在了不同的目录下: 解决方法:关闭Sqlserver及相关的程序,删除目录 ...
- java 24 - 2 GUI之监听机制和适配器改进窗口关闭
我们创建了窗体后,就要对窗体进行操作,比如关闭窗口.而这时候就要建立监听机制: 事件监听机制: A:事件源 事件发生的地方 B:事件 就是要发生的事情 C:事件处理 就是针对发生的事情做出的处理方案 ...
- js模拟高级语言的重载
js以递归的方式模拟高级语言的重载,我以添加元素节点为例子: //现有的子元素之前插入一个新的子元素 var before = function(elem,newElement,targetEleme ...
- Centos5.8 安装 PHP5.5 和 memcached
安装GIT 需要先安装gcc-c++ (sudo yum install gcc-c++) sudo yum install gettext-devel expat-devel cpio perl o ...
- 前端见微知著JavaScript基础篇:this or that ?
上节,我们提到了this关键字的问题,并且追加了一句很有意义的话:谁调用我,我指向谁.的确,在javascript中,在默认情况下,this会指向一个已经初始化的window对象.所以你不论有多少全局 ...
- 【活动】写#听云#原创博文 赢取iPhone 6超级大奖
移动应用的使用量和重要性与日俱增,用户体验的要求也越来越高.与桌面程序相比,移动应用耗电小,速度慢,但手机用户却希望享受到与桌面程序同样的加载速度.那么如何发现移动应用的性能黑洞,优化移动应用性能,这 ...
- WordPress使用固定链接
WordPress安装后我们会发现,文章默认的url是很丑的,http://example.com/?p=N,其中N是文章ID,一串数字.默认链接在所有的环境下都运转良好,但和其他的类型比起来却没那么 ...
- Windows 10 自动升级画面
- Linq连接查询之左连接、右连接、内连接、全连接、交叉连接、Union合并、Concat连接、Intersect相交、Except与非查询
内连接查询 内连接与SqL中inner join一样,即找出两个序列的交集 Model1Container model = new Model1Container(); //内连接 var query ...