ECSHOP 返回顶部代码
第一种样式:
打开模板,底部模板文件 library/page_footer.lbi
在最后加入以下代码:<div class="scroll_div"><a href="#top" title="返回顶部"><img src="images/scroll.png" width="21" height="65" alt="返回顶部" /></a></div>
再在模板CSS文件里加入CSS,并把下面的图片,另存为:scroll.png
/*----- 返回顶部 ------*/ .scroll_div { background:url(images/scroll.png) no-repeat top center; bottom:10px; position:fixed; right:11%; z-index:1; _position:absolute; _bottom:auto; _top:expression( eval(document.compatMode && document.compatMode=='CSS1Compat') ? documentElement.scrollTop +(documentElement.clientHeight - this.clientHeight) - 1:document.body.scrollTop + (document.body.clientHeight - this.clientHeight) - 1); height:65px; width:21px; display:none; color:#FFFFFF; float:right; display: block; cursor:pointer; } * html .scroll_div { background:none; filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=true,sizingMethod=corp,src='images/scroll.png'); bottom:110px; }
第二种样式:
打开模板,底部模板文件 library/page_footer.lbi
在最后加入以下代码:
<div id="scroll"><a href="#" title="返回顶部" class="back-to-top"></a></div>
再在模板CSS文件里加入CSS,并把下面的图片,另存为:back-top.png
#scroll { clear:both; position:fixed; bottom:22px; right:20px; _position:absolute; _right:-35px; width:32px; height:37px; z-index:99; _top:expression(eval(document.compatMode&&document.compatMode=='CSS1Compat') ?documentElement.scrollTop+(documentElement.clientHeight-this.clientHeight)-22:document.body.scrollTop+(document.body.clientHeight-this.clientHeight)-0); z-index:1; } #scroll a { float:left; background:url(images/back-top.png) no-repeat; display:inline; width:48px; height:48px; } #scroll a.back-to-top { background-position:left top; } #scroll a.back-to-top:hover { background-position:right top; }
------------------------------------------华丽丽的分割线---------------------
------------------------------------
源厂制造10-10000级洁净无尘车间防静电防尘用品!网址:http://www.lgfjd.com 微信号:614412
源厂制造10-10000级洁净无尘车间防静电防尘用品!网址:http://www.lgfjd.com 微信号:614412
posted on 2013-01-29 10:48 ECshop商城二次开发博客 阅读(2410) 评论(0) 编辑 收藏 举报