2013-08-30 97 views
0

我顯示的div與jQuery的鼠標淡出和淡出其工作正常,但我想當用戶拖動他的鼠標在該div我想要停止它淡出。jQuery停止FadeOut

這裏是我的代碼

<script type="text/javascript" language="javascript"> 
    function ShowToolTip(obj, _class,_ID) { 
     var my_tooltip = $("#tooltip" + _ID); 
     $(obj).removeAttr("title").mouseover(function() { 
      my_tooltip.css({ opacity: 0.8, display: "none" }).fadeIn(400); 
     }).mousemove(function (kmouse) { 
      my_tooltip.css({ left: kmouse.pageX + 25, top: kmouse.pageY -my_tooltip.height() }); 
     }).mouseout(function() { 
      my_tooltip.fadeOut(400); 
     }); 

    } 
</script> 

回答

0

假設everu obj有它自己的"#tooltip" + _ID

function ShowToolTip(obj, _class,_ID) { 
    var my_tooltip = $("#tooltip" + _ID); 
    $(obj).removeAttr("title").mouseenter(function() { 

     if(my_tooltip.data("closing") == "1") { // If closing 
      my_tooltip.stop(true, true); //Stop closing animation 
      my_tooltip.animate({ opacity: 0.8},0); //Show instantly 
      my_tooltip.removeData("closing"); 
     } else { // if not closing 
      my_tooltip.animate({ opacity: 0.8},400); //Fade in 
     } 
    }).mouseout(function() { 
     my_tooltip.data("closing", "1"); //Flag that closing animation is running 
     my_tooltip.fadeOut(400, function(){ 
      my_tooltip.removeData("closing"); //Fade out callback, remove flag 
     }); 
    }).mousemove(function (kmouse) { 
     my_tooltip.css({ left: kmouse.pageX + 25, top: kmouse.pageY -my_tooltip.height() }); 
    }); 
} 
1

您可以使用jQuery的.stop功能:

my_tooltip.stop();

從上面的文檔:

當.stop()被調用在一個元素上,當前正在運行的動畫 (如果有的話)是立即的LY停止

+0

能否請您修改我的代碼? –