Question

我已经从使用css切换到show / hide到javascript / jquery而不是使用css来使用幻灯片功能。我的菜单都是水平的，没有垂直。幻灯片在技术上是有效的，但如果我从孩子的孩子链接然后对角线到孩子，它完全打破。也许我的逻辑错了？ Animate很酷，但它实际上并没有从左侧滑入（我猜是因为列表从顶部开始上升然后上升，然后从左侧滑动），所以除非有办法使其工作，我需要幻灯片才能工作。

Fiddle

我再次建议去我的测试网站查看实际情况。让它下降到“uhoh”的孩子，然后在其中一个孩子上空盘旋时，对角地去“bam”，然后向左边，然后回到项目上。如果这不会弄乱它，只是随机使它悬停，当你离开时它会搞砸并将鼠标悬停在父项的“项目”上。

My Test Site

Answer 1

从多次进行此类导航的人员中，您的类名和标记中不需要这种复杂性。看看这个小提琴的简化版本：

http://jsfiddle.net/fQsr9/

看起来不那么令人难以置信，并且应该更容易使用jQuery跟踪和操作

Answer 2

问题是我在jquery中调用了一个类，这个类是多个孩子的名字。

// Add the 'hover' event listener to our drop down class 
$("#navbar li.has_children").hover(function() {
    // When the event is triggered, grab the current element 'this' and 
    // find it's children '.sub_navigation' and display/hide them
    //$(this).find("ul.sub_menu").first().animate({ width: "toggle" }, 100);
    $(this).find("ul.sub_menu").first().toggle("slide", {
        direction: "left"
    }, 200);
});

这需要调用另一个悬停函数，并将第二个函数更改为#navbar li ul li.has_children以确保它在正确的位置切换。这仍然给我带来了问题，所以我用悬停而不是切换切换到显示/隐藏，他们现在拉出了相关信息。

现在，如果他们只是停止闪烁......

P.S。在jquery中切换到：has（）来调用每个结构而不是类。谢谢奥斯汀！

Jquery幻灯片切换中断

2 个答案: