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上工作？

回答

相关问题