ecshop首页增加返回顶部按钮js效果

一款jq的返回顶部代码，已测试可以兼容所有浏览器，首时候隐藏，当拉到下面去之后会显示出来。安装方法：
1，page_footer.lbi里面加上代码

<script type="text/javascript">
<!--
$().ready(function() {
$.dialog({id:'scrolltotop',skin:"noborder",position:'rb',move:false,effects:'',
fixed:1,height:160,width:50,border:0,minScrollTop:100,overlay:0,content:'
<img title="回顶部" src="images/emoban_com.jpg" style="width:30px; height:33px;border:none;cursor:pointer;" onclick="scrollToTop()"/>'});
});
function scrollToTop(){
var body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body');
body.animate({scrollTop:0},500);
}
</script>

以及js调用代码

<script src="js/jquery-1.3.2.js"></script>
<script src="js/jquery.dialog.js?6.2.0"></script>

2，打开ECSHOP模板文件夹style.css加入样式代码

#goTopBtn {
POSITION: fixed; TEXT-ALIGN: center; LINE-HEIGHT: 30px; WIDTH: 30px; BOTTOM: 35px; HEIGHT: 33px; FONT-SIZE: 12px; CURSOR: pointer; RIGHT: 0px; _position: absolute; _right: auto
}

3，将附件内的图片文件放到根目录images里，将附件内两个js文件放到根目录js文件夹里就行。

本文标签：

声明：本文由代码号注册/游客用户【又菱】供稿发布，本站不对用户发布的ecshop首页增加返回顶部按钮js效果信息内容原创度和真实性等负责。如内容侵犯您的版权或其他权益，请留言并加以说明。站长审查之后若情况属实会及时为您删除。同时遵循 CC 4.0 BY-SA 版权协议，尊重和保护作者的劳动成果，转载请标明出处链接和本声明内容。本文作者：又菱» /dmh/11578.html

很赞哦！ ()