jQuery - slideUp/slideDown無法在ul上工作？

我已經在我的母版下面的代碼：jQuery - slideUp/slideDown無法在ul上工作？

的jQuery：

$(window).load(function() { 
    $("li.submenu").hover(
     function() { $(this).find("ul").slideDown("slow"); }, 
     function() { $(this).find("ul").slideUp("slow"); } 
    ); 
});

HTML：

<ul class="menu" runat="server" id="Menu"> 
    <li class="first" runat="server"><asp:HyperLink runat="server" NavigateUrl="/index.aspx">Home</asp:HyperLink></li> 
    <li class="submenu" runat="server"> 
     <asp:HyperLink runat="server" NavigateUrl="/categories/index.aspx">Products</asp:HyperLink> 
     <ul runat="server"> 
      <li runat="server"><asp:HyperLink runat="server" NavigateUrl="/categories/category1.aspx">Dogs</asp:HyperLink></li> 
      <li runat="server"><asp:HyperLink runat="server" NavigateUrl="/categories/category2.aspx">Category 2</asp:HyperLink></li> 
      <li runat="server"><asp:HyperLink runat="server" NavigateUrl="/categories/category3.aspx">Category 3</asp:HyperLink></li> 
      <li runat="server"><asp:HyperLink runat="server" NavigateUrl="/categories/category4.aspx">Category 4</asp:HyperLink></li> 
      <li runat="server"><asp:HyperLink runat="server" NavigateUrl="/categories/category5.aspx">Category 5</asp:HyperLink></li> 
      <li class="last" runat="server"><asp:HyperLink runat="server" NavigateUrl="/categories/category6.aspx">Category 6</asp:HyperLink></li> 
     </ul> 
    </li> 
    <li class="last" runat="server"><asp:HyperLink runat="server" NavigateUrl="/contact.aspx">Contact Us</asp:HyperLink></li> 
</ul>

如果我把它改爲toggle("slide")從一側滑動，然後退出上當鼠標進入並離開li.submenu的同一側。這意味着元素的存在是確定的，沒有錯別字。然而，slideDown和slideUp功能似乎不起作用（除非緩慢意味着超快速......）。

我爲jQuery和jQuery UI包含的文件是jquery-1.4.2.js和jquery-ui-1.7.2.custom.min.js。這就夠了，不是嗎？

我有CSS來指定子菜單立即顯示或隱藏（display: block;/display: none;），以防用戶沒有JS。有沒有可能導致這個問題？我應該改變使用JS的子菜單的類，以便如果啓用了JS，CSS不能對其執行操作？或者還有其他一些問題不是由CSS引起的？

來源

2010-11-30 ClarkeyBoy

如果可能的話，你可以張貼在子菜單裏的HTML代碼？ – kobe 2010-11-30 08:30:26

好的，我已經添加了html。我會看看我是否可以找到正在採取行動的確切CSS代碼，並更新問題。它實際上是我在aspx頁面中的確切標記 - 不是「純粹的」HTML代碼。 – ClarkeyBoy 2010-11-30 08:40:50

編輯

這種解決方案實際上沒有工作，現在，我已經進行了測試。當鼠標移出鏈接時，我需要讓子菜單保持可見狀態。在這種情況下它沒有。回到繪圖板..

它實際上原來，我原來的解決方案的工作，但只有當我把

$("ul li.submenu ul").toggle(0);

之前它（這個參數設置菜單的對面，回到原來的狀態用戶甚至沒有意識到）。奇怪，但我可以忍受。

原來的答案

好了一段時間後，相當長一段時間的代碼凝視想知道到底是錯的，它發生，我認爲直接li.submenu中的鏈接是設置爲display: block，寬度和高度設置爲100％。實際上這是需要改變的，導致jQuery看起來如下：

$(document).ready(function() { 
    $("li.submenu > a").hover(
     function() { $(this).closest("li.submenu").find("ul").slideDown("slow"); }, 
     function() { $(this).closest("li.submenu").find("ul").slideUp("slow"); } 
    ); 
});

這就是它......問題解決了。不過，似乎需要一兩秒才能拿起幻燈片說明。這僅僅意味着如果有人在頁面加載的第二個或第二個頁面內懸停在li.submenu之後，它將立即顯示菜單而不是滑動 - 但我認爲這不是問題。

希望這可以幫助未來的人。

來源

2010-11-30 09:04:18 ClarkeyBoy

我認爲ul是你的頁面裏面的項目。如果你想滑當前li的父母ul，然後嘗試

$(window).load(function() { 
    $("li.submenu").hover(
     function() { $(this).parents("ul").slideDown("slow"); }, 
     function() { $(this).parents("ul").slideUp("slow"); } 
    ); 
});

來源

2010-11-30 08:29:06

不要忘了jQuery的動畫不能應用於表（顯示：表;有時也會失敗）

來源

2015-03-16 09:53:27 miguelmpn

jQuery - slideUp/slideDown無法在ul上工作？

回答

相關問題