• 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
  • 相关阅读:
    C#算法,二叉树,单链表,反向链表,stack栈
    系统架构师学习笔记_第十一章(上)_连载
    系统架构师学习笔记_第四章(下)_连载
    [项目过程中所遇到的各种问题记录]ORM篇——使用NHibernate配置对象实体的一些小问题
    含HTML标记的内容分页 (C#)
    PowerShell在SharePoint 2010自动化部署中的应用(1)代码获取
    走向ASP.NET架构设计第一章:走向设计
    asp.net 遍历XML文件节点信息
    系统架构师学习笔记_第一章_连载
    AOP 你想干什么 IOC 你服务什么
  • 原文地址:https://www.cnblogs.com/wangblognet/p/2881031.html
Copyright © 2020-2023  润新知