jquery 层相对于游览器垂直中齐(兼容firefox 和ie)

<script type="text/javascript" src="jquery-1.3.2.min.js"></script><!--添加jquery-->

<script type="text/javascript">

function getObjWh(obj){ 
       var st=document.documentElement.scrollTop ;//滚动条距顶部的距离 
       var sl=document.documentElement.scrollLeft ;//滚动条距左边的距离 
       var ch=document.documentElement.clientHeight ;//屏幕的高度 
       var cw=document.documentElement.clientWidth ;//屏幕的宽度 
       var objH=$("#"+obj).height();//浮动对象的高度 
       var objW=$("#"+obj).width();//浮动对象的宽度 
       var objT=Number (st)+(Number(ch)-Number(objH))/2;  //要居中的层的top:值设定
       var objL=Number(sl)+(Number(cw)-Number(objW))/2; 
       return objT+"|"+objL;              // 当一 个函数需返回两个值时可以用这种方法
    } 
     
     function adjust(){
         var objV=getObjWh("gallery"); 
         var tbT=objV.split("|")[0]+"px"; 
         var tbL=objV.split("|")[1]+"px"; 

         $("#gallery").css({top:tbT,left:tbL}); 
     }
     
      $(document).ready(function(){adjust();});//加这一句是firefox在初次加载时不会执行adjust
     $(window).scroll(function(){adjust()});//当屏幕滚动时
     $(window).resize(function(){adjust()});//当屏幕大小发动时

 

 

 

/*综上最简代码

var tbT=document.documentElement.scrollTop+document.documentElement.clientHeight/2-$("#gallery").height()/2;
var tbL=document.documentElement.scrollLeft+document.documentElement.clientWidth/2-$("#gallery").width()/2;
$("#gallery").css({top:tbT,left:tbL});

*/

 </script>

 

 

<style>

#gallery{ position:absolute; width:300px; height:200px; background:#ccc; z-index:110; display:true;}

</style>

 

<body>
 <div id="gallery">dfddfdfdf<br />dfddfdfdf<br />dfddfdfdf<br />dfddfdfdf<br /></div>
</body>

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值