在设计期这样设置,是一个在上面,另一个在它的底边缘的下面。
运行后,隐藏上面的div,只会在原来的位置显示下面的div(它并不上移);隐藏下面的div,上面的div还会在原来的位置显示。
怎样做才能让两个div在运行后完全重合,当隐藏一个时,在同一个位置显示另一个显示?
------解决方案--------------------------------------------------------
<html>
<head>
<SCRIPT TYPE= "text/javascript ">
function ShowDiv(objid){
var content=document.getElementById( "content ");
var divs=content.getElementsByTagName( "DIV ");
for(var i=0;i <divs.length;i++){
if(divs[i].id==objid){
divs[i].style.display= 'inline ';
}
else{
divs[i].style.display= 'none ';
}
}
}
</SCRIPT>
</head>
<body>
<div id= "all ">
<div id= "title ">
<input type= "button " onclick= "ShowDiv( 'div1 '); " value= "ShowDiv1 "/>
<input type= "button " onclick= "ShowDiv( 'div2 '); " value= "ShowDiv1 "/>
</div>
<div id= "content ">
<div id= "div1 " style= "background-color:#ff0000; display:inline; "> 内容一 </div>
<div id= "div2 " style= "background-color:#00ff00;display:none; "> 内容二 </div>
</div>
</div>
</body>