zoukankan      html  css  js  c++  java
  • 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
  • 相关阅读:
    matlab绘图的坐标轴数字、范围、间隔控制
    机器学习降维算法一:PCA(主成分分析算法)
    信息检索X科普一:查准与召回(Precision & Recall),F1 Measure
    matlab 绘图字体大小控制
    机器学习降维算法二:LDA(Linear Discriminant Analysis)
    25款.NET开发工具
    CA0503:无法显示额外的代码分析警告或错误
    ReportViewer实例教程
    Rational Rose2003 安装错误之error 1920.service NUTCRACKERservice
    读取SqlServer表名及结构
  • 原文地址:https://www.cnblogs.com/wangblognet/p/2881031.html
Copyright © 2011-2022 走看看