jquery - jQuery悬停不能按需要工作

Question

当悬停在幻灯片上时，我想让轮播的箭头出现和消失。我已经尝试过了，但没有太大成功：

$("#slideshow").hover(function(){$('.control').fadeOut(500);$('control').fadeIn(500);});

完整代码在这里

谢谢

Answer 1

我认为您之前.control在.fadeIn(...)通话中错过了一个点。

此外，您可以稍微简化代码并消除错误。

$('.control')
    .fadeOut(500)
    .fadeIn(500);

当然，这只会“闪烁”控件-有关正确功能，请参见@AndrewR 的答案 =)

Answer 2

我认为您使用错误的语法来hover()执行您想做的事情。hover() 方法接受两个回调，一个用于 onmouseover 事件（悬停），一个用于 onmouseout 事件（关闭悬停）。

$('#slideshow').hover(
    function(){
        $('.control').fadeIn(500);
    },
    function(){
        $('.control').fadeOut(500);
    }
);

Answer 3

只需将您的.fadeOut()和.fadeIn()调用链接在一起即可。您不想无缘无故地选择相同的元素集两次。

$('.control').fadeOut(500).fadeIn(500);