正在载入...

文章目录
  1. HTML代码
  2. jQuery代码

今天介绍返回顶部浮动图标代码。代码使用很简单,只需要将HTML代码,和jQuery代码放入到网页的尾部即可。另外你可能还需要找一张你自己喜欢的返回顶部图片,具体演示看本站。


HTML代码

<div style="display:none;" class="back-to" id="toolBackTop">
<a title="返回顶部" onclick="window.scrollTo(0,0);return false;" href="#top" class="back-top">
返回顶部</a>
</div>

jQuery代码

<script src="js/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function () {
        var bt = $('#toolBackTop');
        var sw = $(document.body)[0].clientWidth;
        var limitsw = (sw - 840) / 2 - 80;
        if (limitsw > 0){
                limitsw = parseInt(limitsw);
                bt.css("right",limitsw);
        }
        $(window).scroll(function() {
                var st = $(window).scrollTop();
                if(st > 30){
                        bt.show();
                }else{
                        bt.hide();
                }
        });
})
</script>


本站图标下载:
http://wentong.org/wp-content/themes/itheme/images/back-top.png
-------2011.11.14更新--------
另外一个图标:
非插件简单实现Wordpress返回顶部浮动图标代码

本文链接:

关键词:WordPress, 代码, 返回顶部,

(全文完        )

Comments

7 条评论(网友评论:6 条,博主回复:1 条)快速评论

  1. 又是一位大神 :arrow:

    • 鱼此鱼已

      纯粹爱好者。 :?: 大伙加油。

  2. js哪里下载啊?图片保存到哪里?

  3. 在本页,右键,查看“源代码”,在“源代码”中找出上面的代码。依葫芦画瓢,放在你的网页上就行。

  4. 没有把css代码帖出来

  5. 没有把css代码帖出来

  6. lo

    wordpress 不都是PHP 吗 ?怎么是html代码

你需要 登录 才可以回复.