Question

这里：

http://www.jsfiddle.net/JEXru/1/

我不知道如何制作它如果你将鼠标悬停在幻灯片上它会保持活动状态...帮助？

Answer 1

将您的javascript更改为：

$(function() {
$('.slide').hide();
$('.title:first').css({
    'margin-left': '1px #333 solid'
});
$('ul#horzAccordion ul').hover(
    function() {
         var slideLink = $(this).children('a').attr('name');
         $(slideLink).animate({
             'width': '320px'
         }).show();
    }, function() {
         var slideLink = $(this).children('a').attr('name');
         $(slideLink).animate({
             'width': '0px'
    }, 300).hide();
});
});

你正在做的是将悬停事件设置在仅包含第一个LI的链接上（列表项周围的链接是无效的html，就像你希望将它移动到LI里面一样）。因此，当您的鼠标离开链接时，它会关闭。更新的javascript将悬停设置在内部UL上，以便您可以与显示的内容进行交互。

如果您对上述内容有任何疑问，请与我们联系。

编辑：代码格式化。

Answer 2

根据您的需要，您不需要任何Javascript。将这些添加到您的CSS：

#horzAccordion ul li.slide { display: none; }
#horzAccordion ul:hover li.slide { display: block; }

然后删除你的悬停jQuery函数和$（'。slide'）。hide（）;。

jQuery悬停问题

2 个答案: