菜單上的幻燈片

Question

的頂部出問題我已實現了以下設置（被請求後）：改變圖像的

幻燈片，當用戶鼠標，菜單將出現在右上角，它會消失在鼠標外面。問題是，當我嘗試將鼠標滑過它的項目時，菜單出現問題，它發生在IE6/7和FF 3.5中。

我試過Jquery hover，mouseenter/mouseleave，所有結果都一樣。 http://www.codecookery.com/test/index.html

是否有可能使它不毛刺呢？

Answer 1

你最好使用.hover而不是.mouseenter/leave。

但真正的問題在於，菜單位於幻燈片包裝器之外，因此在菜單上懸停時，將視爲離開幻燈片包裝器。將您的html更改爲以下內容，將菜單嵌套在幻燈片演示器中，然後恢復爲使用.hover功能::

<div id="slideshow-wrapper"> 
    <div id="slideshow"> 
     <img src="images/image1.jpg" alt="Slideshow Image 1" class="active" /> 
     <img src="images/image2.jpg" alt="Slideshow Image 2" /> 
     <img src="images/image3.jpg" alt="Slideshow Image 3" /> 
     <img src="images/image4.jpg" alt="Slideshow Image 4" /> 
    </div> 

    <div id="main-menu"> 
     <ul> 
       <li><a href="#">home</a></li> 
       <li><a href="#">store</a></li> 
       <li><a href="#">services</a></li> 
       <li><a href="#">about</a></li> 
      <li><a href="#">contact</a></li>  
       <li><a href="#">login</a></li> 
     </ul> 
    </div> 
</div>