<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>无标题文档</title><script>window.onload=function(){ var oTab=document.getElementById('tab'); var oLi=oTab.getElementsByTagName('li'); var oCon=document.getElementById('notice-con'); var divs=oCon.getElementsByTagName('div'); for(i=0;i<oLi.length;i++){ oLi[i].index=i; oLi[i].onmouseover=function(){ for(var j=0;j<oLi.length;j++){ oLi[j].className=''; divs[j].className='hide'; } this.className='white'; divs[this.index].className='show'; } }}</script> <link rel="stylesheet" type="text/css" href="reset.css"><style>@charset "utf-8";/* CSS Document */.hide{ display:none; }.show{ display:block;}.juli{ line-height:30px;}.notice{ width:300px; height:98px; margin:0 auto; margin-top:20px; border:1px solid #eee; overflow:hidden;}.tab{ height:27px; position:relative;}.tab ul{ position:absolute; width:310px; left:-1px; }.tab li{ float:left; width:58px; height:26px; line-height:26px; text-align:center; background-color:#fff; background-color:#eee; padding:0 1px;;}.tab li a{ text-decoration:none; color:black;}.tab li a:hover{ color:#f90;}.tab li.white{ background-color:#fff; border-bottom-color:#FFF; border-left:1px solid #eee; padding:0;}</style></head><div id="notice" class="notice"> <ul id="tab" class="tab"> <li class="white"><a href="#">公告</a></li> <li><a href="#">规则</a></li> <li><a href="#">论坛</a></li> <li><a href="#">安全</a></li> <li><a href="#">公益</a></li> </ul> <div class="notice-con" id="notice-con"> <div class="content juli" id="content"> <ul> <li>个人重要信息要管姥 个人重要信息要管姥</li> <li>个人重要信息要管姥 个人重要信息要管姥</li> </ul> <div class="hide juli"> <ul> <li>2222222222222 22222222222</li> <li>2222222222222 22222222222</li> </ul> </div> <div class="hide juli"> <ul> <li>3333333333333 33333333333</li> <li>3333333333333 33333333333</li> </ul> </div> <div class="hide juli"> <ul> <li>4444444444444 44444444444</li> <li>4444444444444 44444444444</li> </ul> </div> <div class="hide juli"> <ul> <li>5555555555555 55555555555</li> <li>5555555555555 55555555555</li> </ul> </div> </div></div><body></body></html>
1 回答
已采纳
玩意11
TA贡献14条经验 获得超10个赞
<div class="content juli" id="content">
<ul>
<li>个人重要信息要管姥 个人重要信息要管姥</li>
<li>个人重要信息要管姥 个人重要信息要管姥</li>
</ul>
</div>
id="content"这个DIV，最后少了一个</div>
添加回答
举报
0/150
提交
取消