欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页

DIV自适应高度

程序员文章站 2022-05-01 08:12:25
...

网站中用DIV标签,需要自适应高度时,可用以下方法:

1、JS:
 1 <script language="javascript"> 
 2 var o1 = document.getElementById("otleft"); 
 3 var o2 = document.getElementById("otright"); 
 4 var h1 = o1.offsetHeight; 
 5 var h2 = o2.offsetHeight; 
 6 if(h1>h2) 
 7     o2.style.height = h1 
 8 else 
 9     o1.style.height = h2 
10 </script>

(放在body中)

 

2、JS:
1 <script type="text/javascript">     
2 window.onload=function(){        
3     document.getElementById("left").style.height = document.getElementById("right").offsetHeight+"px";     
4 } 
5 </script>

放在head中,如果是连接JS文件,在文件中写为:

1 height = function(){            
2       document.getElementById("sidebar").style.height = document.getElementById("content").offsetHeight + "px";  }  
3 window.onload=height;

 

3、JQUERY:
1 <script type="text/javascript" src="jquery-1.3.2.min.js"></script> 
2 <script type="text/javascript"> 
3 $(function(){ 
4     var $l=$("div.l"); 
5     var $r=$("div.r");  
6     var h=$l.height(); 
7     $r.css("height",h); 
8 }); 
9 </script>

 

相关标签: 前端