js 让窗口居中

直接上代码

Js代码  

1. $(function() {  
2.   
3.   
4.     function center_pos(){    
5.         var width = $('.dialog').width();  
6.         var height = $('.dialog').height();  
7.   
8.         var top = (getInner().height - height) / 2 + getScroll().top;  
9.         var left = (getInner().width - width) / 2 +getScroll().left;  
10.   
11.         $('.dialog').css({  
12.             'top': top,  
13.             'left': left  
14.         });  
15.     }  
16.   
17.     $(window).bind('load',center_pos);  
18.     $(window).bind('resize',center_pos);  
19.   
20.       
21. });  

 封装之后:

Js代码  

1. /*** 
2.  * make dialog in center 
3.  */  
4. com.whuang.hsj.centerJQueryPos = function ($div22, isApplyVertical) {  
5.     var width = $div22.width();  
6.     var height = $div22.height();  
7.   
8.     var top = (getInner().height - height) / 2 + com.whuang.hsj.getScroll().top;  
9.     var left = (getInner().width - width) / 2 + com.whuang.hsj.getScroll().left;  
10.     var param = {'left': left};  
11.     if (arguments.length === 1 || isApplyVertical) {//Vertical direction  
12.         param['top'] = top;  
13.     }  
14.     $div22.css(param);  
15. };//centerJQueryPos  

依赖的js方法:

Js代码  

1. //Cross browser gets the size of Visual area window,Have nothing to do with scroll bars  
2. var getInner=(function() {  
3.     // alert(typeof window.innerWidth !== 'undefined');  
4.     if (typeof window.innerWidth !== 'undefined') {//Notice:'undefined' is right  
5.         return function(){  
6.             return {  
7.                 width : window.innerWidth,  
8.                 height : window.innerHeight  
9.             }  
10.         }  
11.     } else {  
12.         return function(){  
13.             return {  
14.                 width : document.documentElement.clientWidth,  
15.                 height : document.documentElement.clientHeight  
16.             }  
17.         }  
18.     }  
19. })();  
20. //Cross browser gets the position of scroll  
21. com.whuang.hsj.getScroll=function(){  
22.     return {  
23.         top:document.documentElement.scrollTop || document.body.scrollTop,  
24.         left:document.documentElement.scrollLeft || document.body.scrollLeft,  
25.         height:document.documentElement.scrollHeight ||document.body.scrollHeight  
26.     };  
27. };