码迷,mamicode.com
首页 > Web开发 > 详细

jquery返回顶部-ie6配合css表达式。

时间:2014-06-12 21:52:32      阅读:362      评论:0      收藏:0      [点我收藏+]

标签:返回顶部   style   class   blog   code   java   

css:

bubuko.com,布布扣
.wraper{ width:980px; height:2048px; margin:0 auto; background:#ccc; }
/*返回头部*/
#backToTop a{ display:block; cursor:pointer;width:25px; height:26px; text-indent:-9999em; position:absolute; left:0; top:0; z-index:10;}
#backToTop .bt_bg{
        background:url(http://i0.cy.com/xtl/main/20140227/backTop.png) no-repeat;_background: 0; _filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src=‘http://i0.cy.com/xtl/main/20140227/backTop.png‘,sizingMethod=‘scale‘); 
        width:25px; height:26px ; position:absolute; left:0; top:0; z-index:8; }
#backToTop { display:none; width:25px; height:26px ; position:fixed; right:50%; margin-right:-533px; bottom:110px; z-index:1; }
/**针对ie6设置*/
*html #backToTop { position:absolute; margin-top:expression(0 - parseInt(this.offsetHeight / 2) + (TBWindowMargin = document.documentElement && document.documentElement.scrollTop || document.body.scrollTop) + ‘px‘);}
bubuko.com,布布扣

 

html:

bubuko.com,布布扣
    <div class="wraper">
        
    </div>
    <script type="text/javascript" src="http://www1.changyou.com/scripts/jquery.min.js"></script>
bubuko.com,布布扣

 

javascript:

bubuko.com,布布扣
    $(‘body‘).append($(‘<div id="backToTop"><a href="javascript:void(0);">回到顶部</a><div class="bt_bg"></div></div>‘).hide(0));
    $(window).scroll(function(){
        $(‘#backToTop‘).show();
        if ($(document).scrollTop() != 0) 
            $(‘#backToTop‘).show();
        else 
            $(‘#backToTop‘).hide();
    });
    $(‘#backToTop a‘).click(function(){
        $(‘html, body‘).animate({
            scrollTop: 0
        }, 800);
        return false;
    });
bubuko.com,布布扣

 

jquery返回顶部-ie6配合css表达式。,布布扣,bubuko.com

jquery返回顶部-ie6配合css表达式。

标签:返回顶部   style   class   blog   code   java   

原文地址:http://www.cnblogs.com/zhidong123/p/3781641.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!