回到顶端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 ...
随机推荐
- [No000061]"别人"凭什么要帮你?&理解中国人的人际和谐&外人、自己人与另一半
你出身平凡家庭:你毕业于普通大学:你没有田晓霞这样的妻子或者普京这样的丈夫:在权力.金钱乃至能力积累上,你才刚刚上路.你很年轻,你渴望成功,那么,"别人"凭什么帮你? " ...
- combobox 属性、事件、方法
一 .combobox 属性.事件.方法公共属性 名称 说明 AccessibilityObject 获取分配给该控件的 AccessibleObject. AccessibleDefaultActi ...
- Android屏幕禁止休眠的方法
实现这一功能的方法有两种,一种是在Manifest.xml文件里面声明,一种是在代码里面修改LayoutParams的标志位.具体如下: 1.在Manifest.xml文件里面用user-permis ...
- nginx的主要用途
1.反向代理加速(无缓存),简单的负载均衡和容错 : 问题一:为什么反向代理可以做加速服务器? 反向代理接受发给web服务器的真实请求,但与web服务器不同的是,它们可以向其他的服务器进行通信.以便 ...
- BZOJ 3309: DZY Loves Math
3309: DZY Loves Math Time Limit: 20 Sec Memory Limit: 512 MBSubmit: 761 Solved: 401[Submit][Status ...
- PAT 1025. 反转链表 (25)
给定一个常数K以及一个单链表L,请编写程序将L中每K个结点反转.例如:给定L为1→2→3→4→5→6,K为3,则输出应该为3→2→1→6→5→4:如果K为4,则输出应该为4→3→2→1→5→6,即最后 ...
- LeetCode 01 Two Sum swift
class TwoSum { func sumTow(nums: [Int], target: Int)->[Int]{ ,]; ;x<nums.count;x++){ ;y<num ...
- [转]Spring JdbcTemplate 查询分页
原文:http://blog.csdn.net/xiaofanku/article/details/4280128 现在进行的项目由于数据库的遗留原因(设计的不堪入目)不能用hibernate.所以用 ...
- MVP 实例
引言 可能有的朋友已经看过我翻译的Jean-Paul Boodhoo的 模型-视图-提供器 模式 一文了(如果没有,建议你先看下再看这篇文章,毕竟这两篇是紧密联系的).在那篇文章中,作者为了说明 MV ...
- scala 学习笔记(06) OOP(下)多重继承 及 AOP
一.多继承 上篇trait中,已经看到了其用法十分灵活,可以借此实现类似"多重继承"的效果,语法格式为: class/trait A extends B with C with D ...