어떻게 웹 페이지 마우스로 왼쪽의 내비게이션 오른쪽에 대응하는 페이지를 표시할 수 있습니까
1583 단어 html+css+js
<style>
#left_nav{width:320px;}
#left_nav ul {list-style: none;margin: 0; padding: 0;overflow:hidden; float: left;}
#left_nav ul li{width: 80px; height: 30px ;border: 1px solid;}
#left_nav .active {background:pink;}
#left_nav div {width: 236px; height: 250px; display: none;border: 1px solid; float: right;background:#e67777}
</style>
<script>
window.οnlοad=function (){
var oDiv=document.getElementById("left_nav");
var aBtn=oDiv.getElementsByTagName("li");
var aDiv=oDiv.getElementsByTagName("div");
for (var i = 0; i < aBtn.length; i++) {
aBtn[i].index=i;
aBtn[i].οnmοuseοver=function (){
for (var i = 0; i < aBtn.length; i++) {
aBtn[i].className="";
aDiv[i].style.display="none";
};
this.className="active";
aDiv[this.index].style.display="block";
};
};
}
</script>
<div id="left_nav">
<ul>
<li class="active"><a href="#"> 1</a></li>
<li><a href="#"> 2</a></li>
<li><a href="#"> 3</a></li>
</ul>
<div style="display:block;"> 1</div>
<div> 2</div>
<div> 3</div>
</div>
</span></code></pre>
<span style="font-size:18px;"><br/></span>
<br/>
</div>
</div>
</div>
</div> 좋은 웹페이지 즐겨찾기
