Wie verwende ich die Hover-Eigenschaft gleichzeitig mit jQuerys Mauszeiger? - jquery, hover, mousemove

Ich habe ein einfaches div mit einem Bild codiertdas folgt dem Mauszeiger nur, wenn die Maus mit der mousemove-Eigenschaft von jQuery im div vorhanden ist. Es funktioniert hervorragend, außer, ich möchte, dass das Bild standardmäßig ausgeblendet wird und nur angezeigt wird, wenn die Maus vorhanden ist (und dann Wenn die Maus wieder verschwindet, verschwindet sie wieder.) Normalerweise kann dies mit der Hover-Eigenschaft gehandhabt werden, funktioniert jedoch nicht, wenn sie mit der Mousemove-Eigenschaft platziert wird. Irgendwelche Ideen?

$(".containerDIV").mousemove(function(e) {$(".image").css({"left" : e.pageX+"px",});});

Hier ist eine Demo-Seite: http://www.fluidweb.ca/movingImage

Danke für die Hilfe!

Andrew

Antworten:

Es wäre wahrscheinlich am besten, eine zu binden jQuery.mousenter und jQuery.mouseleave Event zum Div selbst.

$("div.containerDIV").mouseenter(function(){
$("img.sun").show();
}).mouseleave(function(){
$("img.sun").hide();
});

Einfacher:

$("div.containerDIV").hover(function(e){
$("img.sun")[e.type === "mouseenter" ? "show" : "hide"]();
});