回到顶部和返回首页jquery插件

打造最全的CMS类教程聚合！

 第一种方法：在网页之间插入：

<div id="full" style="width:50px; height:95px; position:fixed; left:50%; top:425px; margin-left:493px; z-index:100; text-align:center; cursor:pointer;"><a><img src="images/up.png" border=0 alt="返回顶部">a>div>
<script src="/js/gotop.js" type="text/javascript">script>

 修改图片路径和js路径，保证图片和JS都 能打开就行了 ！

JS文件下载：点击下载

第二种方法：回到顶部功能：在网页之间插入：

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js">script>

<script>
(function() {
    var $backToTopTxt = "回顶部", $backToTopEle = $('<div class="backToTop">div>').appendTo($("body"))
        .text($backToTopTxt).attr("title", $backToTopTxt).click(function() {
            $("html, body").animate({ scrollTop: 0 }, 120);
    }), $backToTopFun = function() {
        var st = $(document).scrollTop(), winh = $(window).height();
        (st > 0)? $backToTopEle.show(): $backToTopEle.hide();
        //IE6下的定位
        if (!window.XMLHttpRequest) {
            $backToTopEle.css("top", st + winh - 166);
        }
    };
    $(window).bind("scroll", $backToTopFun);
    $(function() { $backToTopFun(); });
})();
script>

---

返回首页功能：

原理就是在基于上段代码中的.click(function() {$("html, body").animate({ scrollTop: 0 }, 120);})点击事件中加入转向链接！具体代码如下：

<script>
(function() {
    var $backToTopind = "回首页", $backToTopEle = $('<div class="backToTop1">div>').appendTo($("body"))
        .text($backToTopind).attr("title", $backToTopind).click(function() {location.href='http://www.meowpet.com';
    }), $backToTopFun = function() {
        var st = $(document).scrollTop(), winh = $(window).height();
        (st > 0)? $backToTopEle.show(): $backToTopEle.hide();

        //IE6下的定位
        if (!window.XMLHttpRequest) {
            $backToTopEle.css("top", st + winh);
        }
    };
    $(window).bind("scroll", $backToTopFun);
    $(function() { $backToTopFun(); });
})();
script>

 第三种方法：

"text/javascript">
var w = 240;
var h = 59;
var str = "";
var obj = document.getElementById("divStayTopLeft");
if (obj)str = obj.innerHTML;
if( typeof document.compatMode != 'undefined' && document.compatMode != 'BackCompat'){
document.writeln('+h+'px;width:'+w+'px;overflow:hidden;POSITION:fixed;_position:absolute; _margin-top:expression(document.documentElement.clientHeight-this.style.pixelHeight+document.documentElement.scrollTop);">');
}
else {
document.writeln('+h+'px;width:'+w+'px;overflow:hidden;POSITION:fixed;*position:absolute; *top:expression(eval(document.body.scrollTop)+eval(document.body.clientHeight)-this.style.pixelHeight);">');
}
document.writeln('

 '); 

document.write(''+str+'

'); 

document.writeln('

'); 

 

 

里边有2张图片，可自行替换，这里就不提供了，找不到图片路径的话会显示成alt里的汉字！