比较优秀的一款超过一屏高度才显示的，跟随滚动条漂浮的返回顶部按钮特效代码。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>test</title>
<style>
body{ height:2000px;}
.rTop{ width:100px; height:25px; text-align:center; font-size:small; line-height:25px; border:1px solid #999; position:fixed; right:0; bottom:0;
border-bottom-color:#333; border-right-color:#333; margin:5px; cursor:pointer; display:none}
</style>
</head>
<body>
<div class="rTop" id="rTop">返回顶部</div>
<script>
window.onscroll=function(){
if(document.body.scrollTop||document.documentElement.scrollTop>0){
document.getElementById('rTop').style.display="block"
}else{
document.getElementById('rTop').style.display="none"
}
}
</script>
</body>
</html>
分享到：
相关推荐
主要介绍了javascript简单实现跟随滚动条漂浮的返回顶部按钮效果,涉及javascript基于onscroll事件动态改变页面元素样式的相关技巧,需要的朋友可以参考下
Jquery跟随滚动条漂浮层
用CSS实现跟随滚动条漂浮层代码，纯CSS实现，鼠标跟随漂浮层。可自己有定制漂浮位置。
Jquery 跟随滚动条漂浮层，实现漂浮层不随网页下移而滚动，jquery实现
当页面滚动时(监听scroll事件)，浏览器滚动条处于最顶部时，隐藏“返回顶部”按钮，当滚动条继续向下滚动时，动态计算出当前可视窗口的高度-按钮高度-按钮距浏览器下边缘高度得到的值，如果这个值大于某个特定的数字...
这是一个跟随滚动条漂浮的JS特效，就是说滚动条滚动而元素相对屏幕位置不变 网上有很多类似的效果，本代码比较起来有如下优点： 1. 兼容IE6.0+ & FF1.5+ 2. 使用非常简单，属于菜鸟最爱的那种拿来就能用的，见下面...
跟随滚动条跨屏截图，可以将网站当前整个页面截下来。
浮动广告，跟随滚动条移动的源码，大家可以看一下
jQuery插件页面滚动返回顶部按钮 jQuery插件页面滚动返回顶部按钮
div或其他html块内容跟随滚动条移动，滚动移动时，内容跟着移动，并保持最右边
winform悬浮框跟随滚动条：实现悬浮框跟谁滚动条移动而移动
易语言按钮滚动条源码,按钮滚动条,按钮工具条移动
滚动条滚动 div跟着动 并且div不闪烁
vc自定义滚动条外观 制作五颜六色的滚动条(水平滚动条,垂直滚动条).zip
易语言滚动条控制按钮源码,滚动条控制按钮,获取位置,设置位置
Flex 按钮代替滚动条,看了就知道了。。
VB6.0实现滚动条用图片的美化效果，是一个图形化滚动条的专有VB控件，可应用 于众多的VB工程软件中，可美化你的窗体，自定义你的窗口界面，与主界面相融合，当然VB中的滚动条控件有很多了，这一个仅供参考哦。
百度百科快速二级导航带返回顶部悬浮漂浮导航菜单代码