jQuery: Mausposition prüfen mit .is(":hover")

[molily]

Hallo,

Es gibt einige Browser (z.B. Firefox), die automatisch ein mouseenter feuern, wenn die Seite geladen wird. Das Element unterm Mauszeiger bekommt dann eben das Event. Wenn das zufällig das Menü ist, dann bekommt es eben ein mouseenter-Event.

Andere Browser feuern den mouseenter erst, wenn der Mauszeiger auf dem Element bewegt wird. Das Element bekommt also initial keinen Event.

Man kann soweit ich weiß nicht herausbekommen, ob es sich um einen initialen mouseenter handelt oder um einen »normalen« mouseenter-Event. Ich wüsste nicht, an welchem Kriterium man das *eindeutig* erkennen könnte.

Was du natürlich tun kannst, ist mit dem mousemove-Event zu arbeiten. Das ist aber ein fieser Hack in meinen Augen. Mousemove-Events werden im Gegensatz zu mouseenter auch nicht unbedingt von Geräten emuliert, die eine Touch-Bedienung haben. Von Tastaturbedienung ganz zu schweigen.

$("#mainNavi > ul > li").is(":hover") => liefert mir allerdings die Fehlermeldung: "...unsupported pseudo: hover"

Klar. :hover ist ein spezieller CSS-Selektor, den jQuery mit querySelector(All) bzw. der Selektor-Engine Sizzle nicht emulieren kann.

Es soll im Prinzip so sein, wie hier: www.fcbayern.de

Dort wird vermutlich serverseitig die active-Klasse gesetzt und clientseitig beim mouseenter auf dem aktive Element geprüft, woher die Maus kommt (event.relatedTarget). Du kannst ja in den Quellcode schauen und die genaue Logik untersuchen.

Mathias