zoukankan      html  css  js  c++  java
  • wordpress返回顶部的功能

    1. 在style.css中添加如下代码

    #gotop{
        38px;
        height:36px;
        position:fixed;
        bottom:25px;
        right:10px;
        top:auto;
        display:block;
        cursor:pointer;
        background: url(images/gotop.gif) no-repeat
    }
    
    *html #gotop{
        position:absolute;
        bottom:auto; top:expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,10)||0)));
    }

    2. 在footer.php中添加如下代码

    <!-- 返回顶部 -->
    <div style="display: none;" id="gotop"></div>
    <script type='text/javascript'>
        backTop=function (btnId){
            var btn=document.getElementById(btnId);
            var d=document.documentElement;
            var b=document.body;
            window.onscroll=set;
            btn.onclick=function (){
                btn.style.display="none";
                window.onscroll=null;
                this.timer=setInterval(function(){
                    d.scrollTop-=Math.ceil((d.scrollTop+b.scrollTop)*0.1);
                    b.scrollTop-=Math.ceil((d.scrollTop+b.scrollTop)*0.1);
                    if((d.scrollTop+b.scrollTop)==0) clearInterval(btn.timer,window.onscroll=set);
                },10);
            };
            function set(){btn.style.display=(d.scrollTop+b.scrollTop>100)?'block':"none"}
        };
        backTop('gotop');
    </script>
    <!-- 返回顶部END -->

    3. 添加返回顶部按钮图片 可以选择自己喜欢的

    将图片保存到主题文件夹下的images里,图片名叫gotop.gif

    http://devework.com/wordpress-top-bottom-comment2.html

  • 相关阅读:
    Python 变量回收
    centos服务器内部开启端口
    mysql启动不起来汇总
    torch中DataLoader加载字典
    torch.meshgrid函数
    如何配置好python脚本的命令行参数
    git忽略文件,.gitignore配置
    jupyter如何解析命令行参数argv
    怎么制作虚拟环境的yaml
    如何提高matplotlib在jupyter中作图的分辨率
  • 原文地址:https://www.cnblogs.com/yangcong/p/3614677.html
Copyright © 2011-2022 走看看