Orbit jQuery插件:如何淡入方向导航箭头？

Question

我试图让导航箭头仅在用户将鼠标悬停在"#featured“div上或显示时才会出现。到目前为止，我有以下代码来完成这项工作，但是非常突然：

$("#featured, div.slider-nav").hover(function(){
    $("div.slider-nav").animate({'opacity':'1.0'}, 400);},
function() {
    $("div.slider-nav").animate({'opacity':'0'}, 400);
});

.animate()函数中包含的时间仅用作延迟，这与使用.animate()操纵颜色时的效果不同(尽管jQuery需要单独的插件来设置颜色动画)。那么，在这种情况下，平滑地淡入导航箭头的最好方法是什么？

Answer 1

您应该在包装器上应用悬停，这样就不必单独包含nav。这样它就不会排队和开火两次了。

也可以使用mouseenter mouseleave，并在动画之前停止：

$(".orbit-wrapper").mouseenter(function(){
  $("div.slider-nav").stop().animate({'opacity':'1'}, 400);
}).mouseleave(function(){
 $("div.slider-nav").stop().animate({'opacity':'0'}, 400);
});