您的位置:首页 > Web前端 > JQuery

jquery最简单的右侧返回顶部代码(滚动才出现)

2013-09-04 11:47 507 查看
<div style="display:none;" id="gotopbtn" class="to_top"><a title="返回顶部" href="javascript:void(0);"></a></div>
<script type="text/javascript">
$(function(){

$(window).scroll(function(){
$(window).scrollTop()>200 ? $("#gotopbtn").css('display','').click(function(){
$(window).scrollTop(0);
}):$("#gotopbtn").css('display','none');
});

});
</script>


CSS代码

.to_top a,.to_top a:hover{ background:url(../images/gotop1_03.gif) no-repeat;}
.to_top a{
background-position:0 0;float:left;height:83px;overflow:hidden;width:25px;position:fixed;bottom:35px;cursor:pointer;right:20px;
_position:absolute;
_right:auto;
_left:expression(eval(document.documentElement.scrollLeft+document.documentElement.clientWidth-this.offsetWidth)-(parseInt(this.currentStyle.marginLeft, 10)||0)-(parseInt(this.currentStyle.marginRight, 10)||20));
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop, 10)||20)-(parseInt(this.currentStyle.marginBottom, 10)||20)));
}
.to_top span{ background:url(../images/gotop1_03.gif) no-repeat;}
.to_top span{
background-position:0 0;float:left;height:83px;overflow:hidden;width:25px;position:fixed;bottom:35px;cursor:pointer;right:20px;
_position:absolute;
_right:auto;
_left:expression(eval(document.documentElement.scrollLeft+document.documentElement.clientWidth-this.offsetWidth)-(parseInt(this.currentStyle.marginLeft, 10)||0)-(parseInt(this.currentStyle.marginRight, 10)||20));
_top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop, 10)||20)-(parseInt(this.currentStyle.marginBottom, 10)||20)));
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: