首页 新闻 会员 周边

当用户点击的时候,返回顶部按钮有个特效怎么弄呢?

0
[已关闭问题] 关闭于 2016-12-14 18:42
<style>
body{box-sizing:border-box;margin:0; padding:0}
.active_o{width:40px; height:40px; padding:20px; font:14px/20px "微软雅黑"; text-align:center;
background:blue; position:fixed;right:20px;bottom:20px;cursor:pointer; color:#fff;border-radius:50%;opacity: 1}
.active{opacity: 0}
</style>
window.onload = function(){
var oTop = document.getElementById("top");
window.onscroll = function(){
var scrolltop = document.documentElement.scrollTop || document.body.scrollTop;
if(scrolltop > 200){
oTop.className='active_o';
}else if(scrolltop <= 200){
oTop.className='active';
}
};
oTop.onclick = function(){
document.documentElement.scrollTop = document.body.scrollTop =0;
//当点击元素时,让页面的滚动距离为0.写两个是为了兼容。

}
}

<body style="height:5000px;">
<h1>主题内容</h1>
<div id="top" class="active">返回顶部</div>
</body>
白马希的主页 白马希 | 菜鸟二级 | 园豆:220
提问于:2016-12-13 19:53
< >
分享
所有回答(2)
0

获取高度啊,用JQuery实现,里面有这样的方法。


Jeffcky | 园豆:2789 (老鸟四级) | 2016-12-13 20:00

不想用jq写。。。

支持(0) 反对(0) 白马希 | 园豆:220 (菜鸟二级) | 2016-12-14 18:41
0

直接用window.scrollTo(0,0);//第一个参数横坐标,第二参数纵坐标

jasondyoung | 园豆:424 (菜鸟二级) | 2016-12-13 21:46

还没有学。。。这个

支持(0) 反对(0) 白马希 | 园豆:220 (菜鸟二级) | 2016-12-14 18:42
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册