滚动返回页面顶部的JS特效gototop

主题footer有个“返回页顶”的按钮,是用#top实现的,点一下就蹭地跳到页顶了,太不优雅,不符合我的美学概念。这本是个芝麻绿豆的小事情,可我没事就喜欢捣腾Wordpress,我想能改用JS滚动效果该有多好呀。还真的让我找到了,远在天边,近在眼前,这款主题的作者zEUS已经写过这样的教程,不过据他反应因锚点冲突,导致博客评论分页失效,所以zEUS已经弃用了此特效。我试了一下,可能我的Wordpress适应能力强一些,并没有评论分页失效的情况,呵呵。我就拿来主义一下,把此特效分享给大家。

1、点此下载gototop.js文件,解压后将该文件上传至主题目录下。

2、将以下代码添加到footer.php文件中。
<script src=”<?php bloginfo(‘stylesheet_directory’); ?>/gototop.js” type=”text/javascript” charset=”utf-8″></script>

3、在footer.php中合适的位置加入以下代码调用上述JS。
<a href=”javascript:void(0)” onclick=”goto_top()”>返回页顶</a>

 

简简单单三步就添加了滚动返回页面顶部的JS特效,效果可以参看我的页底“返回页顶”按钮,很不错吧,嘿嘿。

滚动至顶部