高手,晚上好。本小白从网上下载的一款代码,原来只有10个排列项,效果很好,鼠标一放在该列表项,就会显示放大,鼠标一离开,又会立即恢复原状;
  如图:
            点击第1项;  
            点击其它项,第1项,会立即恢复到原状;
  我增加了第11项和第12项;效果也出来了,但是,如果点击第11个或者第12个后再点击别的列表项,不会像上面10个那样,该项会自动隐藏;
  如图:
           点击第11项;
           点击其它项,第11项,不会立即恢复到原状,必须再一次点击该项本身,才能恢复到文字状态;  
          第12项也是如此;
          第12项也是如此;
  不知道这是什么原因,高手给看看。谢谢!

解决方案 »

  1.   

    代码如下,这是CSS和JS
    <style type="text/css"> 
    <!-- 
    /*============ Global Style Start ============*/ 
    *{margin:0;padding:0;} 
    body{background-color:#FFF;color:#000;font:normal 12px "宋体", Georgia, "Times New Roman", Times, serif;} 
    img{border:0;} 
    a:link,a:visited{color:#000;text-decoration:none;}a:hover{color:#00a9e0;text-decoration:underline;} 
    div,p,span,h1,h2,h3,h4,h5,h6,input,ul,li{text-align:left;} 
    ul,li{list-style-type:none;} 
    dt,dd{clear:both;} 
    p{line-height:150%;} 
    .cred,a.cred:link,a.cred:visited,a.cred:hover{color:#F00;} 
    .corange,a.corange:link,a.corange:visited,a.corange:hover{color:#F65100;} 
    /*clear both*/ 
    .clearfix:after {content: ".";display:block;height:0;clear: both; visibility: hidden;} 
    .clearfix {display: inline-block;} 
    /* Hides from IE-mac \*/ 
    * html .clearfix {height: 1%;} 
    *+html .clearfix {height: 1%;} 
    .clearfix {display: block;} 
    /* End hide from IE-mac */ 
    .clear{ clear: both; font-size:1px; width:1px; height:1px; visibility: hidden;} 
    /*============ End Global Style ============*/ 
    #sidebar{width:260px;height:auto;} 
    #CDCCCA;letter-spacing:1px;overflow:hidden;background-color:#fff;} #sidebar p{margin:0 auto;margin:10px 0 10px 0;width:233px;height:36px;color:#777575;background-color:#F7F7F7;display:block;padding:15px;border:1px solid #C5C4C1;} 
    .num_one{display:none;height:54px;padding:8px 10px;border:1px solid #E5E5E5;border-width:1px 0px;background-color:#F4F4F4;clear:both} 
    .num_one span{float:left;margin-right:10px;display:block;width:37px;height:48px;padding-top:4px;font-size:32px;color:#F70303;text-align:center} 
    .num_one .p50{float:left;margin-right:10px;} 
    .num_one ul{float:left;padding:0} 
    .num_one ul li{padding-bottom:2px;white-space:nowrap} 
    .num_two{cursor:pointer;height:24px;padding:2px 8px 0;clear:both} 
    .num_two span{display:block;width:17px;line-height:14px;float:left;background:url(images/au_num01.gif) no-repeat 0% 50%;color:#000000;margin:4px 6px 0 0;font-weight:bold;text-align:center} 
    .num_two a{float:left;margin-top:4px !important;margin-top:6px} 
    .bg{background-color:#FBFBFB;} 
    .bg01{background-color:#F7F7F7;} 
    #copyright{margin:0 auto;margin-top:10px;width:960px;padding:20px 0 20px 0;text-align:center;border-top:3px solid #DDD;} 
    --> 
    </style> 
    <script language="javascript" type="text/javascript"> 
    <!-- 
    // 浏览器兼容的获取节点方法 
    function $(objectId){ 
    if(document.getElementById && document.getElementById(objectId)){ 
    // W3C DOM 
    return document.getElementById(objectId); 

    else if (document.all && document.all(objectId)){ 
    // MSIE 4 DOM 
    return document.all(objectId); 

    else if (document.layers && document.layers[objectId]){ 
    // NN 4 DOM.. note: this won't find nested layers 
    return document.layers[objectId]; 

    else{ 
    return false; 


    /* Script Form www.wangyou.com */ 
    var now_show_id =0 ; 
    function swap(id,bool) 

    //alert(bool); 
    if(id == now_show_id )return true; 
    now_show_id =id ; 
    for(var i=1;i<=10;i++) 

    if(bool) 

    if($('b'+i) != null){ 
    $("b"+i).style.display = bool ? 'none' : 'block'; 
    $("s"+i).style.display = bool ? 'block' : 'none'; 



    $("b"+id).style.display = bool ? 'block' : 'none'; 
    $("s"+id).style.display = bool ? 'none' : 'block'; 

    var now_id = 1; 
    function swap1(id,bool) 

    //alert(bool); 
    if(id == now_id )return true; 
    now_id =id ; 
    for(var i=1;i<=10;i++) 

    if(bool) 

    if($('d'+i) != null){ 
    $("d"+i).style.display = bool ? 'none' : 'block'; 
    $("a"+i).style.display = bool ? 'block' : 'none'; 



    $("d"+id).style.display = bool ? 'block' : 'none'; 
    $("a"+id).style.display = bool ? 'none' : 'block'; 

    /* End Script */ 
    //--> 
    </script> 
      

  2.   

    这是具体的HTML:
    <body> 
    <div id="sidebar"> <div id="s1" onmouseover="swap('1',1 );" class="num_two bg01"><span>01</span><a href="/p570074.html" target='_blank'>MP3格式--真...</a></div><div id="b1" onMouseOut="swap('1',0 );" class="num_one"><span>01</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" /></a></div><ul><li><a href="/p570074.html" target="_blank">MP3格式--真...  <img src="images/try.gif" width="14" height="11" alt="播放" /></a></li><li>歌手:<a href="http://www.kancba.com" target='_blank'>汪宇东</a></li><li><a href="#" class="more02" onclick='top_song_vote(this,570074,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a></li></ul></div> 
    <div id="s2" onmouseover="swap('2',1 );" class="num_two bg"><span>02</span><a href="/p628771.html" target='_blank'>Too youn...</a></div><div id="b2" onMouseOut="swap('2',0 );" class="num_one"><span>02</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" /></a></div><ul><li><a href="/p628771.html" target="_blank">Too youn...  <img src="images/try.gif" width="14" height="11" alt="播放" /></a></li><li>歌手:<a href="http://www.kancba.com" target='_blank'>OuttaSk...</a></li><li><a href="#" class="more02" onclick='top_song_vote(this,628771,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a></li></ul></div> 
    <div id="s3" onmouseover="swap('3',1 );" class="num_two bg01"><span>03</span><a href="/p17186.html" target='_blank'>原创→恐怖的一天</a></div><div id="b3" onMouseOut="swap('3',0 );" class="num_one"><span>03</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" /></a></div><ul><li><a href="/p17186.html" target="_blank">原创→恐怖的一天  <img src="images/try.gif" width="14" height="11" alt="播放" /></a></li><li>歌手:<a href="http://www.kancba.com" target='_blank'>孙宇</a></li><li><a href="#" class="more02" onclick='top_song_vote(this,17186,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a></li></ul></div> 
    <div id="s4" onmouseover="swap('4',1 );" class="num_two bg"><span>04</span><a href="/p214259.html" target='_blank'>想你的日子</a></div><div id="b4" onMouseOut="swap('4',0 );" class="num_one"><span>04</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" /></a></div><ul><li><a href="/p214259.html" target="_blank">想你的日子  <img src="images/try.gif" width="14" height="11" alt="播放" /></a></li><li>歌手:<a href="http://www.kancba.com" target='_blank'>鑫鑫</a></li><li><a href="#" class="more02" onclick='top_song_vote(this,214259,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a></li></ul></div> 
    <div id="s5" onmouseover="swap('5',1 );" class="num_two bg01"><span>05</span><a href="/p787832.html" target='_blank'>咖啡年华</a></div><div id="b5" onMouseOut="swap('5',0 );" class="num_one"><span>05</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" /></a></div><ul><li><a href="/p787832.html" target="_blank">咖啡年华  <img src="images/try.gif" width="14" height="11" alt="播放" /></a></li><li>歌手:<a href="http://www.kancba.com" target='_blank'>帅帅_WU</a></li><li><a href="#" class="more02" onclick='top_song_vote(this,787832,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a></li></ul></div> 
    <div id="s6" onmouseover="swap('6',1 );" class="num_two bg"><span>06</span><a href="/p595468.html" target='_blank'>身别的朋友</a></div><div id="b6" onMouseOut="swap('6',0 );" class="num_one"><span>06</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" /></a></div><ul><li><a href="/p595468.html" target="_blank">身别的朋友  <img src="images/try.gif" width="14" height="11" alt="播放" /></a></li><li>歌手:<a href="http://www.kancba.com" target='_blank'>随风扬</a></li><li><a href="#" class="more02" onclick='top_song_vote(this,595468,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a></li></ul></div> 
    <div id="s7" onmouseover="swap('7',1 );" class="num_two bg01"><span>07</span><a href="/p605794.html" target='_blank'>《放学》</a></div><div id="b7" onMouseOut="swap('7',0 );" class="num_one"><span>07</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" /></a></div><ul><li><a href="/p605794.html" target="_blank">《放学》  <img src="images/try.gif" width="14" height="11" alt="播放" /></a></li><li>歌手:<a href="http://www.kancba.com" target='_blank'>衣冠&琴兽</a></li><li><a href="#" class="more02" onclick='top_song_vote(this,605794,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a></li></ul></div> 
    <div id="s8" onmouseover="swap('8',1 );" class="num_two bg">
    <span>08</span>
    <a href="/p609012.html" target='_blank'>原创「经典情书」
    </a>
    </div>
    <div id="b8" onMouseOut="swap('8',0 );" class="num_one">
    <span>08</span>
    <div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" /></a>
    </div>
    <ul>
    <li>
    <a href="/p609012.html" target="_blank">原创「经典情书」  <img src="images/try.gif" width="14" height="11" alt="播放" />
    </a>
    </li>
    <li>歌手:<a href="http://www.kancba.com" target='_blank'>布拉格のVae</a>
    </li>
    <li>
    <a href="#" class="more02" onclick='top_song_vote(this,609012,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a>
    </li>
    </ul>
    </div> 
    <div id="s9" onmouseover="swap('9',1 );" class="num_two bg01"><span>09</span><a href="/p567174.html" target='_blank'>祝愿(原创)</a></div><div id="b9" onMouseOut="swap('9',0 );" class="num_one"><span>09</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" /></a></div><ul><li><a href="/p567174.html" target="_blank">祝愿(原创)  <img src="images/try.gif" width="14" height="11" alt="播放" /></a></li><li>歌手:<a href="http://www.kancba.com" target='_blank'>超人LOVE</a></li><li><a href="#" class="more02" onclick='top_song_vote(this,567174,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a></li></ul></div> <div id="s10" onmouseover="swap('10',1 );" class="num_two bg">
    <span>10</span>
    <a href="/p639976.html" target='_blank'>《走音格格》
    </a>
    </div>
    <div id="b10" onMouseOut="swap('10',0 );" class="num_one"><span>10</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" />
    </a>
    </div>
    <ul>
    <li>
    <a href="/p639976.html" target="_blank">《走音格格》  <img src="images/try.gif" width="14" height="11" alt="播放" />
    </a>
    </li>
    <li>歌手:<a href="http://www.kancba.com" target='_blank'>☆Gina★
    </a>
    </li>
    <li>
    <a href="#" class="more02" onclick='top_song_vote(this,639976,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a>
    </li>
    </ul>
    </div><!--新建的第十一个-->
    <div id="s11" onmouseover="swap('11',1 );" class="num_two bg">
    <span>11</span>
    <a href="/p639976.html" target='_blank'>《走音格格》
    </a>
    </div>
    <div id="b11" onMouseOut="swap('11',0 );" class="num_one"><span>11</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" />
    </a>
    </div>
    <ul>
    <li>
    <a href="/p639976.html" target="_blank">《走音格格》  <img src="images/try.gif" width="14" height="11" alt="播放" />
    </a>
    </li>
    <li>歌手:<a href="http://www.kancba.com" target='_blank'>☆Gina★
    </a>
    </li>
    <li>
    <a href="#" class="more02" onclick='top_song_vote(this,639976,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a>
    </li>
    </ul>
    </div>
    <!--新建的第十二个-->
    <div id="s12" onmouseover="swap('12',1 );" class="num_two bg">
    <span>12</span>
    <a href="/p639976.html" target='_blank'>《走音格格》
    </a>
    </div>
    <div id="b12" onMouseOut="swap('12',0 );" class="num_one"><span>12</span><div class="p50"><a href="http://www.kancba.com" target='_blank'><img src="http://www.kancba.com/images/logo.gif" width="50" height="50" alt="" />
    </a>
    </div>
    <ul>
    <li>
    <a href="/p639976.html" target="_blank">《走音格格》  <img src="images/try.gif" width="14" height="11" alt="播放" />
    </a>
    </li>
    <li>歌手:<a href="http://www.kancba.com" target='_blank'>☆Gina★
    </a>
    </li>
    <li>
    <a href="#" class="more02" onclick='top_song_vote(this,639976,-10,-40,"test");return false;' style='cursor:hand;'>给我投票 >></a>
    </li>
    </ul>
    </div>
    </div> 
    </body> 
      

  3.   

    楼主没看到两个for循环都是10改成12就好了!<script language="javascript" type="text/javascript"> 
    <!-- 
    // 浏览器兼容的获取节点方法 
    function $(objectId){ 
    if(document.getElementById && document.getElementById(objectId)){ 
    // W3C DOM 
    return document.getElementById(objectId); 

    else if (document.all && document.all(objectId)){ 
    // MSIE 4 DOM 
    return document.all(objectId); 

    else if (document.layers && document.layers[objectId]){ 
    // NN 4 DOM.. note: this won't find nested layers 
    return document.layers[objectId]; 

    else{ 
    return false; 


    /* Script Form www.wangyou.com */ 
    var now_show_id =0 ; 
    function swap(id,bool) 

    //alert(bool); 
    if(id == now_show_id )return true; 
    now_show_id =id ; 
    for(var i=1;i<=12;i++) 

    if(bool) 

    if($('b'+i) != null){ 
    $("b"+i).style.display = bool ? 'none' : 'block'; 
    $("s"+i).style.display = bool ? 'block' : 'none'; 



    $("b"+id).style.display = bool ? 'block' : 'none'; 
    $("s"+id).style.display = bool ? 'none' : 'block'; 

    var now_id = 1; 
    function swap1(id,bool) 

    //alert(bool); 
    if(id == now_id )return true; 
    now_id =id ; 
    for(var i=1;i<=12;i++) 

    if(bool) 

    if($('d'+i) != null){ 
    $("d"+i).style.display = bool ? 'none' : 'block'; 
    $("a"+i).style.display = bool ? 'block' : 'none'; 



    $("d"+id).style.display = bool ? 'block' : 'none'; 
    $("a"+id).style.display = bool ? 'none' : 'block'; 

    /* End Script */ 
    //--> 
    </script>