wordpress给主题添加一个返回顶部按钮

朋友说需要一个返回顶部的按钮,所以就去百度扒出一个JS代码。演示请看本站!

1、把“返回顶部”的代码,将代码复制到需要添加此代码主题的footer.php文件,</body>标签之后、</html>标签之前的位置。

<div id="full" style="width: 50px; height: 95px; position: fixed; left: 49%; top: 476px; margin-left: 493px; z-index: 100; text-align: center; cursor: pointer;">
<a><img alt="返回顶部" src="http://www.5oc.cn/logo/feedback_return.gif" border="0" /></a></div>
<script type="text/javascript" src="http://www.5oc.cn/wp-content/themes/你的主题/js/news_top.js"></script>


2、请将此调用的js文件 http://www.5oc.cn/wp-content/themes/主题/js/news_top.js文件保存到自己网站主题的目录内,然后将代码修改为自己的调用地址。

3、以下是news_top.js文件内容:

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) };

4、将图片链接地址换上自己喜欢的图片地址,根据自己的习惯更改高度及位置。



2 Thoughts on “wordpress给主题添加一个返回顶部按钮

  1. 我现在的博客跟这个代码一样,原本准备弄个渐进返回到顶部,可惜就是没安装成功,等有时间再折腾吧

发表评论

电子邮件地址不会被公开。 必填项已用*标注

文章导航

无觅相关文章插件,快速提升流量

返回顶部