代码太乱不想看~~看了效果~我觉得是鼠标离开使菜单消失那个事件处理不大好~~不要鼠标一离开就消失,搞个定时消失,
如:window.tt=setTimeout("candan.hide()",1000)
而鼠标再回到上面则取消定时器~~如:clearTimeout(window.tt)
这样就不会闪了~~~

解决方案 »

  1.   

    请教有多个菜单时怎么控制显示和隐藏.<html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
    <title>怎么让鼠标经过弹出菜单的链接时不闪烁</title>
    <style type="text/css">
    body {
    margin:0px;
    background-repeat: repeat;
    }
    body,td,th {
    font-size: 9pt;
    }a:link {
    color: #000000;
    text-decoration: none;
    }
    a:visited {
    text-decoration: none;
    color: #000000;
    }
    a:hover {
    text-decoration: underline;
    color: #FF0000;
    }
    a:active {
    text-decoration: none;
    color: #000000;

    }
    div{ padding:0px; margin:0px;word-break:break-all;border-collapse: collapse;}
    ul{list-style-type: none;display:inline; margin:0px; }
    li{list-style-type: none;text-indent:1px;display:inline;margin:0px;}
    img{ border:0px;}
    .SortList4_Info_List_Div{ float:left; display:inline; width:915px;}
    .SortList4_Sort1_Item_Div{ float:left;}
    .SortList4_Sort1_Img_Div{ float:left; width:88px;}
    #SortList4_Sort1_Item_4{ float:left; width:103px;}
    .SortList4_Sort2_AllItem_class
    {display:none;
    background-color:#f2f2f2;
    filter:alpha(opacity=10);
    border-bottom:1px solid #999999;
    }
    .SortList4_Sort2_Titel_Div
    { width:88px;
    height:25px;
    line-height:25px;
    vertical-align:middle;
    border-top:1px solid #999999;
    border-left:1px solid #999999;
    border-right:1px solid #999999;
    }
    .SortList4_Sort2_Titel_Div ul li a{text-indent:15px;}
    </style>
    <script type="text/javascript" language="javascript">
    var interval = false;//判断是否可以隐藏菜单
    function showsort1(obj)
     {  
        
       for(var i=1;i<obj.childNodes.length;i++)
        {
    interval = true;
            obj.childNodes[i].style.display = "block";
            obj.childNodes[i].style.position = "absolute";
            obj.childNodes[i].style.top = (2+i*25)+"px";
            obj.childNodes[i].style.left = (obj.offsetLeft)+"px";  
    var filter = obj.childNodes[i].filters.alpha.opacity;
            showalpha(obj.childNodes[i],filter);
        }
     }function hidden(obj)
     {
       if(interval)
       {
        return;
    }
       for(var i=1;i<obj.childNodes.length;i++)
        {
    var filter = obj.childNodes[i].filters.alpha.opacity;
            hiddenalpha(obj.childNodes[i],filter);
    interval = false;
            obj.childNodes[i].style.display = "none";
            
        }
     }
      function hiddensort1(obj){
        interval = false;
        delay(hidden,1,this,[obj]);//延时执行隐藏菜单的功能,因为需要当鼠标滑到子菜单上时,是不需要隐藏菜单的
     }function delay(fn,parm,scope,config)
    {    
        var start = new Date();    
        var zero_interval = null;
        var config = config || [];   
        var h = function(){
            if(new Date()-start >=parm){    
                clearInterval(zero_interval);    
                fn.apply(scope,config);  
            }    
        }
        zero_interval = setInterval(h,parm);    
    }   
    function  showalpha(obj,b){ 
            if(b <=100)
    {   
    b=b+2
    }
    else
    {
    return

     obj.filters.alpha.opacity=b;
            setTimeout(function(){showalpha(obj,b)},5); 
    }
    function  hiddenalpha(obj,b){ 
            if(b >5)
    {   
    b=b-5
    }
    else
    {
    return

     obj.filters.alpha.opacity=b;
            setTimeout(function(){hiddenalpha(obj,b)},2); 
    }</script>
    </head>
    <body>
        <table width="1004" border="0" align="center" cellpadding="0" cellspacing="0">
      <tr>    
        <td width="915" valign="bottom" ><span id="SortList4" ShowTitle="False"><div class="SortList4_Info_List_Div" id="SortList4_Info_List_Div" style="height:;width:;">

    <div id="SortList4_Sort1_Item_1" class="SortList4_Sort1_Item_Div" onmouseover="showsort1(this);" onmouseout="hiddensort1(this);">
    <div id="SortList4_Sort1_Img_1" class="SortList4_Sort1_Img_Div">
    <a href="/Pages/NewsSort.aspx?Sort1=2&amp;Sort2=1" target="_parent" title="抢险救援"><img src="../image/Sort/2007111512212.gif" alt="抢险救援" /></a>
    </div><div id="SortList4_Sort2_AllItem_id_1" class="SortList4_Sort2_AllItem_class">
    <div id="SortList4_Sort2_Item_0" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_0" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=2&amp;Sort2=1&amp;Sort3=1" target="_parent" title="社会救援">社会救援</a></li>
    </ul>
    </div>
    </div>
    <div id="SortList4_Sort2_Item_1" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_1" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=2&amp;Sort2=2&amp;Sort3=1" target="_parent" title="灾难抢险">灾难抢险</a></li>
    </ul>
    </div>
    </div> </div>
    </div>

    <div id="SortList4_Sort1_Item_3" class="SortList4_Sort1_Item_Div" onmouseover="showsort1(this);" onmouseout="hiddensort1(this);">
    <div id="SortList4_Sort1_Img_3" class="SortList4_Sort1_Img_Div">
    <a href="/Pages/NewsSort.aspx?Sort1=4&amp;Sort2=1" target="_parent" title="消防文化"><img src="../image/Sort/200711151230.gif" alt="消防文化" /></a>
    </div><div id="SortList4_Sort2_AllItem_id_3" class="SortList4_Sort2_AllItem_class">
    <div id="SortList4_Sort2_Item_0" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_0" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=4&amp;Sort2=1&amp;Sort3=1" target="_parent" title="消防史话">消防史话</a></li>
    </ul>
    </div>
    </div>
    <div id="SortList4_Sort2_Item_1" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_1" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=4&amp;Sort2=2&amp;Sort3=1" target="_parent" title="消防摄影">消防摄影</a></li>
    </ul>
    </div>
    </div>
    <div id="SortList4_Sort2_Item_2" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_2" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=4&amp;Sort2=3&amp;Sort3=1" target="_parent" title="消防艺术品">消防艺术品</a></li>
    </ul>
    </div>
    </div>
    </div>
    </div>
    <div id="SortList4_Sort1_Item_9" class="SortList4_Sort1_Item_Div" onmouseover="showsort1(this);" onmouseout="hiddensort1(this);">
    <div id="SortList4_Sort1_Img_9" class="SortList4_Sort1_Img_Div">
    <a href="/Pages/NewsSort.aspx?Sort1=10&amp;Sort2=1" target="_parent" title="消防知识"><img src="../image/Sort/2007111512418.gif" alt="消防知识" /></a>
    </div><div id="SortList4_Sort2_AllItem_id_9" class="SortList4_Sort2_AllItem_class">
    <div id="SortList4_Sort2_Item_0" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_0" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=10&amp;Sort2=1&amp;Sort3=1" target="_parent" title="灭火知识">灭火知识</a></li>
    </ul>
    </div>
    </div><div id="SortList4_Sort3_AllItem_id0" class="SortList4_Sort3_AllItem_Class">
    <div id="SortList4_Sort3_Item_0" class="SortList4_Sort3_Item_Div"> </div>
    <div id="SortList4_Sort3_Item_1" class="SortList4_Sort3_Item_Div"> </div>
    <div id="SortList4_Sort3_Item_2" class="SortList4_Sort3_Item_Div"> </div>
    <div id="SortList4_Sort3_Item_3" class="SortList4_Sort3_Item_Div"> </div> </div> </div>
    </div> </div>
    </div></span></td>
      </tr></table>
        
    </body>
    </html>
      

  2.   

    还请兄台帮我改改
    <html xmlns="http://www.w3.org/1999/xhtml" >
    <head>
    <title>多个弹出菜单时怎么控制子菜单的显示或隐藏</title>
    <style type="text/css">
    body {
    margin:0px;
    background-repeat: repeat;
    }
    body,td,th {
    font-size: 9pt;
    }a:link {
    color: #000000;
    text-decoration: none;
    }
    a:visited {
    text-decoration: none;
    color: #000000;
    }
    a:hover {
    text-decoration: underline;
    color: #FF0000;
    }
    a:active {
    text-decoration: none;
    color: #000000;

    }
    div{ padding:0px; margin:0px;word-break:break-all;border-collapse: collapse;}
    ul{list-style-type: none;display:inline; margin:0px; }
    li{list-style-type: none;text-indent:1px;display:inline;margin:0px;}
    img{ border:0px;}
    .SortList4_Info_List_Div{ float:left; display:inline; width:915px;}
    .SortList4_Sort1_Item_Div{ float:left;}
    .SortList4_Sort1_Img_Div{ float:left; width:88px;}
    #SortList4_Sort1_Item_4{ float:left; width:103px;}
    .SortList4_Sort2_AllItem_class
    {display:none;
    background-color:#f2f2f2;
    filter:alpha(opacity=10);
    border-bottom:1px solid #999999;
    }
    .SortList4_Sort2_Titel_Div
    { width:88px;
    height:25px;
    line-height:25px;
    vertical-align:middle;
    border-top:1px solid #999999;
    border-left:1px solid #999999;
    border-right:1px solid #999999;
    }
    .SortList4_Sort2_Titel_Div ul li a{text-indent:15px;}
    </style>
    <script type="text/javascript" language="javascript">
    var interval = false;//判断是否可以隐藏菜单
    function showsort1(obj)
     {  
        
       for(var i=1;i<obj.childNodes.length;i++)
        {
    interval = true;
            obj.childNodes[i].style.display = "block";
            obj.childNodes[i].style.position = "absolute";
            obj.childNodes[i].style.top = (2+i*25)+"px";
            obj.childNodes[i].style.left = (obj.offsetLeft)+"px";  
    var filter = obj.childNodes[i].filters.alpha.opacity;
            showalpha(obj.childNodes[i],filter);
        }
     }function hidden(obj)
     {
       if(interval)
       {
        return;
    }
       for(var i=1;i<obj.childNodes.length;i++)
        {
    var filter = obj.childNodes[i].filters.alpha.opacity;
            hiddenalpha(obj.childNodes[i],filter);
    interval = false;
            obj.childNodes[i].style.display = "none";
            
        }
     }
      function hiddensort1(obj){
        interval = false;
        delay(hidden,1,this,[obj]);//延时执行隐藏菜单的功能,因为需要当鼠标滑到子菜单上时,是不需要隐藏菜单的
     }function delay(fn,parm,scope,config)
    {    
        var start = new Date();    
        var zero_interval = null;
        var config = config || [];   
        var h = function(){
            if(new Date()-start >=parm){    
                clearInterval(zero_interval);    
                fn.apply(scope,config);  
            }    
        }
        zero_interval = setInterval(h,parm);    
    }   
    function  showalpha(obj,b){ 
            if(b <=100)
    {   
    b=b+2
    }
    else
    {
    return

     obj.filters.alpha.opacity=b;
            setTimeout(function(){showalpha(obj,b)},5); 
    }
    function  hiddenalpha(obj,b){ 
            if(b >5)
    {   
    b=b-5
    }
    else
    {
    return

     obj.filters.alpha.opacity=b;
            setTimeout(function(){hiddenalpha(obj,b)},2); 
    }</script>
    </head>
    <body>
    <span id="SortList4" ShowTitle="False"><div class="SortList4_Info_List_Div" id="SortList4_Info_List_Div" style="height:;width:;">
    <div id="SortList4_Sort1_AllItem_id" class="SortList4_Sort1_AllItem_class">
    <div id="SortList4_Sort1_Item_0" class="SortList4_Sort1_Item_Div" onmouseover="showsort1(this);" onmouseout="hiddensort1(this);">
    <div id="SortList4_Sort1_Img_0" class="SortList4_Sort1_Img_Div">
    <a href="/Pages/NewsSort.aspx?Sort1=1&amp;Sort2=1" target="_parent" title="灭火前线"><img src="../image/Sort/2007111512125.gif" alt="灭火前线" /></a>
    </div><div id="SortList4_Sort2_AllItem_id_0" class="SortList4_Sort2_AllItem_class">
    <div id="SortList4_Sort2_Item_0_0" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_0_0" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=1&amp;Sort2=1&amp;Sort3=1" target="_parent" title="典型战例">典型战例</a></li>
    </ul>
    </div>
    </div>
    <div id="SortList4_Sort2_Item_0_1" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_0_1" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=1&amp;Sort2=2&amp;Sort3=1" target="_parent" title="灭火报道">灭火报道</a></li>
    </ul>
    </div>
    </div> </div>
    </div>
    <div id="SortList4_Sort1_Item_1" class="SortList4_Sort1_Item_Div" onmouseover="showsort1(this);" onmouseout="hiddensort1(this);">
    <div id="SortList4_Sort1_Img_1" class="SortList4_Sort1_Img_Div">
    <a href="/Pages/NewsSort.aspx?Sort1=2&amp;Sort2=1" target="_parent" title="抢险救援"><img src="../image/Sort/2007111512212.gif" alt="抢险救援" /></a>
    </div><div id="SortList4_Sort2_AllItem_id_1" class="SortList4_Sort2_AllItem_class">
    <div id="SortList4_Sort2_Item_1_0" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_1_0" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=2&amp;Sort2=1&amp;Sort3=1" target="_parent" title="社会救援">社会救援</a></li>
    </ul>
    </div>
    </div>
    <div id="SortList4_Sort2_Item_1_1" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_1_1" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=2&amp;Sort2=2&amp;Sort3=1" target="_parent" title="灾难抢险">灾难抢险</a></li>
    </ul>
    </div>
    </div> </div>
    </div>

    <div id="SortList4_Sort1_Item_3" class="SortList4_Sort1_Item_Div" onmouseover="showsort1(this);" onmouseout="hiddensort1(this);">
    <div id="SortList4_Sort1_Img_3" class="SortList4_Sort1_Img_Div">
    <a href="/Pages/NewsSort.aspx?Sort1=4&amp;Sort2=1" target="_parent" title="消防文化"><img src="../image/Sort/200711151230.gif" alt="消防文化" /></a>
    </div><div id="SortList4_Sort2_AllItem_id_3" class="SortList4_Sort2_AllItem_class">
    <div id="SortList4_Sort2_Item_3_0" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_3_0" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=4&amp;Sort2=1&amp;Sort3=1" target="_parent" title="消防史话">消防史话</a></li>
    </ul>
    </div>
    </div>
    <div id="SortList4_Sort2_Item_3_1" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_3_1" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=4&amp;Sort2=2&amp;Sort3=1" target="_parent" title="消防摄影">消防摄影</a></li>
    </ul>
    </div>
    </div>
    <div id="SortList4_Sort2_Item_3_2" class="SortList4_Sort2_Item_Div">
    <div id="SortList4_Sort2_Titel_3_2" class="SortList4_Sort2_Titel_Div">
    <ul>
    <li><a href="/Pages/NewsSort.aspx?Sort1=4&amp;Sort2=3&amp;Sort3=1" target="_parent" title="消防艺术品">消防艺术品</a></li>
    </ul>
    </div>
    </div>
    </div>
    </div>


    </div>
    </div></span>
        
    </body>
    </html>