このjQueryイベントをHTML要素のホバーにバインドするにはどうすればよいですか？

Question

h2.myClassが呼び出されたときにjQueryのこのビットを呼び出す構文は何ですか？すべての答えに

$(document).ready(function(){ 
    setTimeout(function(){ 
    $("div.clickme, div.clickMeTimes").fadeOut("slow", function() { 
    $("div.clickme, div.clickMeTimes").remove(); 
    }); 

    }, 2500); 
}); 

おかげで、それらの多くは非常に良好であったが、@SKSは私の余分な要件に余分なマイルを行ってきました。以下は、ページの読み込み時の初期値ではなく、マウスのホバー上でのdivのフェードアウトです。

$(document).ready(function(){ 
    $('h2.myClass').hover (function() { 
     $("div.clickme, div.clickMeTimes").stop(true).fadeOut("slow"); 
    }, function() { 
     $("div.clickme, div.clickMeTimes").stop(true).fadeIn("slow");  
    }); 
}); 

Answer 1

あなただけのマウス入力で実行される何かをしたいので。 mouseenter機能を使用することができます。私はあなたが望むものである以下だと思い

は、

$(document).ready(function(){ 
    $('h2.myClass').mouseenter(function() { 
    setTimeout(function(){ 
     $("div.clickme, div.clickMeTimes").fadeOut("slow", function() { 
      $(this).remove(); 
     }); 
    }, 2500); 
    }); 
}); 

はまた、両方の要素を削除しようとしているのではなく、対応する要素を削除します $(this).remove()へのコールバックの内側 $("div.clickme, div.clickMeTimes").remove();を変更しました。

編集：以下を試してみてください。もしあなたがfadeInとfadeOutにしてください。

$(document).ready(function(){ 
    $('h2.myClass').hover (function() { 
     $("div.clickme, div.clickMeTimes").stop(true).fadeOut("slow"); 
    }, function() { 
     $("div.clickme, div.clickMeTimes").stop(true).fadeIn("slow");  
    }); 
}); 

Answer 2

$(".myClass").hover(function(eIn) { // this is the function for when the mouse is hovered over the item 
    //do work 
}, 
function(eOut) { // this is the func when the mouse leaves the item 
    //do work 
}); 

Answer 3

$("h2.myClass").hover(function(){ 
    setTimeout(function(){ 
    $("div.clickme, div.clickMeTimes").fadeOut("slow", function() { 
    $("div.clickme, div.clickMeTimes").remove(); 
    }); 

    }, 2500); 
} 

Answer 4

機能であなたのロジックを入れて：

var fadeAndRemove = function() { 

    setTimeout(function(){ 
     $("div.clickme, div.clickMeTimes").fadeOut("slow", function() { 
       $("div.clickme, div.clickMeTimes").remove(); 
     }); 

     }, 2500); 
} 

その後、ホバーイベントにバインド：

$("h2.myClass").on('mouseenter', function() { 
    fadeAndRemove(); 
}); 

使用をあなたもmouseleaveに行うには気にいらを持っている場合ホバー。

Answer 5

あなたはだけホバー作業をする必要がある場合：

$("h2.myClass").mouseover(function(){ 
    $("div.clickme, div.clickMeTimes").fadeOut("slow", function() { 
    $("div.clickme, div.clickMeTimes").remove(); 
}); 

あなたはそれを動作させる、タイマーを停止する必要がありそうでない場合：

$(document).ready(function(){ 
    timer = setTimeout(function(){ 

$("h2.myClass").mouseover(function(){ 
    clearTimeout(timer); 
    $("div.clickme, div.clickMeTimes").fadeOut("slow", function() { 
    $("div.clickme, div.clickMeTimes").remove(); 
});