javascript 返回顶部
<style>
#linGoTopBtn {
POSITION: fixed; TEXT-ALIGN: center; LINE-HEIGHT: 30px; WIDTH: 30px; BOTTOM: 35px; HEIGHT: 33px; FONT-SIZE: 12px; CURSOR: pointer; RIGHT: 0px;
}
</style>
<script>
function linGoTop()
{
var obj = document.getElementById("linGoTopBtn");
function getScrollTop()
{
return document.documentElement.scrollTop;
}
function setScrollTop(value)
{
document.documentElement.scrollTop ? document.documentElement.scrollTop = value : document.body.scrollTop = value;
}
window.onscroll = function()
{
getScrollTop() > 0 ? obj.style.display ='' : obj.style.display = 'none';
}
obj.onclick = function()
{
var goTop = setInterval(scrollMove, 5); // 单位毫秒
function scrollMove()
{
setScrollTop(getScrollTop()/1.1);
if(getScrollTop() < 1) clearInterval(goTop);
}
}
}
</script>
</head>
<body style="text-align:center">
<DIV style="DISPLAY: none" id="linGoTopBtn"><IMG border=0 src="data:images/top.jpg"></DIV>
<SCRIPT type="text/javascript">linGoTop();</SCRIPT>
</body>
</html>
javascript 返回顶部的更多相关文章
- javascript返回顶部几种代码总结
纯js代码 /** * 回到页面顶部 * @param acceleration 加速度 * @param time 时间间隔 (毫秒) **/ function goTop(acceleration ...
- javascript返回顶部插件+源码
javascript插件->returnTop.js: /* ** 插件名称returnTop.js ** 调用返回头部单例参数说明 ** 调用方式:turn.init(ele,speed); ...
- JavaScript返回顶部特效
样式: <style type="text/css"> /*返回顶部特效*/ a { border: none; text-decoration: none; outl ...
- 写一个JavaScript“返回顶部”功能
在web页面中,如果页面较高,为了方便用户快速地返回顶部,都会添加一个返回顶部按钮. 效果演示可以查看本页.如果页面有滚动高度,右下角就会有一个含有“返回顶部”字样的黑色背景半透明的小条条.点击这里“ ...
- Javascript返回顶部
控制按钮下拉到达一定距离时显示,返回顶层时消失,用JS中的延时定时器来模拟滚动条效果 <script type="text/javascript"> window.on ...
- 【JavaScript&jQuery】返回顶部
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- gotop(返回顶部)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 使用Javascript实现返回顶部功能。
为了提高网站的浏览体验及友好度,相信大部分网站需要一个返回顶部的按钮,如果使用传统的a标记,再做一个div加上链接的话,非常麻烦,不仅每个页面都需要添加,而且不能实现非常智能的效果及简化维护时间. 下 ...
- JavaScript之返回顶部
为了弄这个Hexo,今天又是坐在电脑面前待了一天( ⊙ o ⊙ ),老是出问题,在百度上也试验了很多方法,还是没弄好,诶...身心疲惫甚是乏累啊~~~ 算了,这个Hexo先不弄,还是安分点吧,在Hex ...
随机推荐
- smarty对网页性能的影响--开启opcache
在上一篇<smarty对网页性能的影响>中,默认没有开启opcache,于是我安装了一下zend opcache扩展,重新实验了一下,结果如下: 有smarty 用apache的ab命令进 ...
- 使用VisualSVN Server搭建SVN服务器(转载)
转载于http://www.cnblogs.com/greywolf/archive/2013/01/28/2879952.html 使用 VisualSVN Server来实现主要的 SVN功能则要 ...
- PHP基本语法(一)
整形:就是对用整数 正整数与负整数整形的表示:int integer NOTICE:写整形的时候不要在外面再加引号了 浮点:就是小数 3.1415926Float 浮点 布尔值:男和女 真和假 阴和 ...
- IOS程序内发短信 MFMessageComposeViewController
文章转载地址:http://www.headsky.org/?p=63 iOS4.0新加入了MFMessageComposeViewController和MFMessageComposeViewCon ...
- Eclipse开发PHP环境配置
首先准备好软件: 1. Apache,到这里找个最新版本 2. PHP,到这里下载 3. Eclipse IDE for Java EE Developers,到这里下载 4. DLTK Core F ...
- css匹配原理与优化
一. 匹配原理 浏览器CSS匹配不是从左到右进行查找,而是从右到左进行查找.比如之前说的 DIV#divBox p span.red{color:red;},浏览器的查找顺序如下:先查找 html 中 ...
- Android应用程序所包含的四种组件和DDMS
关注用户组件 Activity 编辑文本 .玩游戏 后台进程 Service ...
- iOS之正则表达式的使用
一.什么是正则表达式 正则表达式,又称正规表示法,是对字符串操作的一种逻辑公式.正则表达式可以检测给定的字符串是否符合我们定义的逻辑,也可以从字符串中获取我们想要的特定部分.它可以迅速地用极简单的方式 ...
- Java Interface and Abstraction
本文引用资源申明: http://blog.csdn.net/xw13106209/article/details/6923556 http://www.cnblogs.com/dolphin0520 ...
- warning(包括PHP中的notice)必须改吗?
作者:马 岩(Furzoom) (http://www.cnblogs.com/furzoom/)版权声明:本文的版权归作者与博客园共同所有.转载时请在明显地方注明本文的详细链接,未经作者同意请不要删 ...