스크립트 제어 3행 3열 고도 DIV 레이아웃 적응

이 예는 JS 스크립트로 병렬 DIV의 높이를 제어하는 것이다. 보통 DIV 레이아웃에서 높이에 적응하는 것은 비교적 골치 아픈 문제이다. 주로 배경도, 외투 DIV, 오른쪽 칸으로 왼쪽 칸을 덮는다.해결해.지금 스크립트를 추가하면 훨씬 간단합니다. 만약에 세 개의 수평으로 나란히 있는 DIV, fbox, mbox, sbox가 있다면 탭에 onload="P7 equalCols ('fbox','mbox ','sbox')"를 쓰면 테스트 조건: ie5.x、ie6.0、FF1.03、NS7.2、opera8.01. 최종 효과.
JS 코드: 판권은 원작자에게 귀속되고 학습 연구만 제공한다. 

 
  
/*  
  
------------------------------------------------  
  
PVII Equal CSS Columns scripts  
  
Copyright (c) 2005 Project Seven Development  
  
www.projectseven.com  
  
Version: 1.5.0  
  
------------------------------------------------  
  
*/  
  
function P7_colH(){ //v1.5 by PVII-www.projectseven.com  
  
var i,oh,hh,h=0,dA=document.p7eqc,an=document.p7eqa;if(dA&&dA.length){  
  
for(i=0;ioh=dA[i].offsetHeight;h=(oh>h)?oh:h;}for(i=0;idA[i].style.height=h+'px';}else{P7_eqA(dA[i].id,dA[i].offsetHeight,h);}}if(an){  
  
for(i=0;ih){  
  
dA[i].style.height=(h-(hh-h))+'px';}}}else{document.p7eqa=1;}  
  
document.p7eqth=document.body.offsetHeight;  
  
document.p7eqtw=document.body.offsetWidth;}  
  
}  
  
function P7_eqT(){ //v1.5 by PVII-www.projectseven.com  
  
if(document.p7eqth!=document.body.offsetHeight||document.p7eqtw! =document.body.offsetWidth){  
  
P7_colH();}  
  
}  
  
function P7_equalCols(){ //v1.5 by PVII-www.projectseven.com  
  
if(document.getElementById){document.p7eqc=new Array;for(i=0;idocument.p7eqc[i]=document.getElementById(arguments[i]);} setInterval("P7_eqT()",10);}  
  
}  
  
function P7_eqA(el,h,ht){ //v1.5 by PVII-www.projectseven.com  
  
var sp=10,inc=10,nh=h,g=document.getElementById(el),oh=g.offsetHeight,ch=parseInt(g.style.height) ;  
  
ch=(ch)?ch:h;var ad=oh-ch,adT=ht-ad;nh+=inc;nh=(nh>adT)?adT:nh;g.style.height=nh+'px';  
  
oh=g.offsetHeight;if(oh>ht){nh=(ht-(oh-ht));g.style.height=nh+'px';}  
  
if(nh}  
  
 
 

스크립트 제어 3줄 3열 자동 적응 고도 DIV 레이아웃