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

发布于：电脑网络, 精品推荐, 转来载去 2,312 次践踏

主题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特效，效果可以参看我的页底“返回页顶”按钮，很不错吧，嘿嘿。

与

,,

相关的文章

  3. Pingback: 【wordpress知识技巧】Jquery特效实现滑动返回顶部效果 | Skyth.Com|中文博文推荐

  11. Pingback: 滚动返回页面顶部的JS特效 - 大杂门

  14. Pingback: 0blog

  18. 哈哈，正常正常，我以前也一直想着如何能让我那边显示页面的时候是先半透明然后渐渐过渡显示出来的效果，但没找着，自己又不会写，无奈····路过支持你这里一下，可惜我不用这个功能咯～

  20. 我找了一會, 才發現在下面頁腳, 本還以為在旁邊隨窗口跑哩..
    這和以前的 a href="#top" 動作一樣, 但畫面增加滾動的效果, 看得舒服多了!
    還有, 搬遷服務器之後我把 gzip 方式停了, 已有更好方法, 改天再公怖.