网站地图    收藏   

主页 > 后端 > wordpress教程 >

wordpress博客添加返回顶部按钮方法 - WordPress

来源:自学PHP网    时间:2014-11-28 23:42 作者: 阅读:

[导读] 我们会看很多的wordpress博客都有一个到了底部可以直接返回顶部按钮效果,下面我就来告诉大家如何快速给wordpress博客添加返回顶部按钮吧,有需要的朋友可参考 三步来实现为一个wordpre...

wordpress博客添加返回顶部按钮方法

我们会看很多的wordpress博客都有一个到了底部可以直接返回顶部按钮效果,下面我就来告诉大家如何快速给wordpress博客添加返回顶部按钮吧,有需要的朋友可参考.

三步来实现为一个wordpress站点添加“返回顶部”按钮。

1、打开wordpress后台,选择“外观”–“编辑”–找到“footer.php”,在</body>之前加上下面这段代码:

  1. <div id="full" style=" 
  2. width:50px; 
  3. height:95px; 
  4. position:fixed; 
  5. left:50%; top:420px; 
  6. margin-left:493px; 
  7. z-index:100; 
  8. text-align:center; 
  9. cursor:pointer;"> 
  10. <a><img src="121008370928.png" border=0 alt="返回顶部"></a> </div> 
  11. <script type="text/javascript">var isie6 = window.XMLHttpRequest ? false : true; function newtoponload() { var c = document.getElementById("full"); function b() { var a = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop; if (a > 0) { if (isie6) { c.style.display = "none"; clearTimeout(window.show); window.show = setTimeout(function () { var d = document.documentElement.scrollTop || window.pageYOffset || document.body.scrollTop; if (d > 0) { c.style.display = "block"; c.style.top = (400 + d) + "px" } }, 300) } else { c.style.display = "block" } } else { c.style.display = "none" } } if (isie6) { c.style.position = "absolute" } window.onscroll = b; b() } if (window.attachEvent) { window.attachEvent("onload", newtoponload) } else { window.addEventListener("load", newtoponload, false) } document.getElementById("full").onclick = function () { window.scrollTo(0, 0) };</script> 
然后保存,删除缓存文件即可。

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号-1@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com

添加评论