不用插件为WordPress添加一个返回顶部按钮

自己动手为WordPress添加一个“返回顶部”按钮，操作方法：

1、首先把以下代码添加到WordPress主题的footer.php中，我是放在</body>的上面的。

<div id="backtop" style="position:fixed; right:5px; bottom:5px; text-align:center; cursor:pointer; color:#f06246;font-weight:bold">
 返回顶部</div>
 <script type="text/javascript" src="<?php echo get_template_directory_uri(); ?>/gototop.js"></script>
 </div>

2、把如下代码保存为gototop.js放在与footer.php的相同目录。

var isie6 = window.XMLHttpRequest ? false : true; function newtoponload() { var c = document.getElementById("backtop"); 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("backtop").onclick = function () { window.scrollTo(0, 0) };

至此，当网页向下滚动一些时，在网页右下方就会出现一个“返回顶部”按钮。另外也可通过CSS对按钮外观进行个性化设置。效果见本站aiboshuo.com。

另外按键盘上的home键也是一样的返回顶部效果哦