无插件实现wordpress返回顶部功能

找了不少方法,这个应该是最简单的了。

将如下代码加入到footer.php中即可。

<div id="full" style="position: fixed; right: 5px; bottom: 5px; text-align: center; cursor: pointer;"><a><img alt="返回顶部" src="http://ww2.sinaimg.cn/large/9cb23867jw1dw4ob9tjjij.jpg" border="0" /></a></div>

如果你觉得返回按钮的图标不好看,可以将第二行中的图片url换成你自己的url即可。

位置也可以通过第一行进行调整。

最好一行是实现返回顶部的Javascript代码,你可以把代码保存到你自己服务器的相关目录下。

文件new_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 &gt; 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 &gt; 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) };

标签: wordpress

相关文章推荐

添加新评论 (无需注册,可直接评论)

仅有一条评论

  1. no1zx.cn

    好像按教程安装了以后不能实现返回顶部效果 www.no1zx.cn