在鼠標懸停上顯示一個元素並將其隱藏在鼠標上

Question

我有這個小腳本，它顯示了img的標題，當它被隱藏時。

$("#v1").mouseover(function() 
    { 
     $("#vc1").fadeIn("slow"); 
    }); 

我怎樣才能在這個擴展，這樣的標題#vc1淡出回來了當圖標#v1不是鼠標滑過？

Answer 1

$("#v1") 
     .mouseover(function() { 
     $("#vc1").fadeIn("slow"); 
     }) 
     .mouseout(function() { 
     $("#vc1").fadeOut("slow"); 
     }); 

可能會考慮使用懸停，這基本上是mouseenter和mouseleave

$("#v1") 
     .hover(
      function() { 
       $("#vc1").fadeIn("slow"); 
      }, 
      function() { 
       $("#vc1").fadeOut("slow"); 
     }); 

所不同的是，當你進入到該事件處理是元素的子元素mouseover和mouseout必火附加，而mouseenter和mouseleave又名hover不會。如果您附加的元素沒有子元素，這可能不成問題。

Answer 2

您可以mouseover一起使用mouseout（或使用mouseenter和mouseleave而是取決於你想要什麼樣的行爲，當鼠標在#v1孩子）。

Answer 3

這應該做的工作：

$("#v1").hover(function() 
{ 
    $("#vc1").fadeIn("slow"); 
}, function() 
{ 
    $("#vc1").fadeOut("slow"); 
}); 

而且HTT：//api.jquery.com是很好的資源，可以幫助很多的未來。

Answer 4

您可以使用懸停功能。

$("#v1").hover(function(){ 
    $("#vc1").fadeIn("slow"); 

    }, function(){ 
    $("#vc1").fadeOut("slow"); 

    });