jQuery: onMouseOver
lima-city → Forum → Die eigene Homepage → HTML, CSS & Javascript
bedingung
beispiel
bild
bit
button
code
erscheinen
form
formular
funktion
http
lauten code
maus
methode
millisekunde
nutzer
prinzip
probier
url
verschwinden
-
Hallo Leute,
ich habe folgendes Problem:
Ich würde gerne per "onmouseover" einen div-Container erscheinen lassen, das klapp ja alles super. Wenn ich dann jedoch machen will, das wenn ich mit der Maus in dem div bin, dass die Form nicht verschwindet, klappt das nicht. Ich dachte mir ich mache es genauso mit onmouseover. Wie gedacht passiwert folgendes: Form kommt, verschwindet, kommt, verschwindet.....
So nun meine Frage:
Kann mir jemand helfen, dies zu lösen. Bin neu im umgang mit jQuery.
Hier einmal ein Video zur besseren Vorstellung. ;)
Der Code vom Menü bzw. Bild:
<img src="img/menü/login.png" onMouseOver="$('#loginform').fadeIn(500); this.src='img/menü/login_hover.png'" onMouseOut="$('#loginform').hide(500); this.src='img/menü/login.png'"/></a>
Bei der Form habe ich noch nichts stehen.
MfG ;o) -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage
-
Entfern doch einfach das onmouseout-Event?
Wenn ich das richtig verstanden habe, soll ja nur einmalig beim Überfahren des Buttons das Formular angezeigt werden. Wann genau soll es denn wieder verschwinden?
Beitrag zuletzt geändert: 20.7.2011 5:03:23 von fabo -
Du könntest, statt direkt hide() aufzurufen, ein TimeOut setzen:
und in das #loginform wird ein onMouseOver gesetzt, welchesvar timeoutVariable = window.setTimeout("hide(500)", 10);
aufruft.window.clearTimeout(timeoutVariable);
Das gleiche Spiel kann auch umgekehrt gemacht werden, sodass ein timeOut gesetzt wird, wenn das #loginform verlassen wird, dieses timeOut aber geblockt wird, wenn unmittelbar darauf das Bild anvisiert wird.
Dem User sollte die kleine Zeitverzögerung nicht auffallen, wenn das div wirklich ausgeblendet wird.
lg Ole -
fabo schrieb:
Entfern doch einfach das onmouseout-Event?
Wenn ich das richtig verstanden habe, soll ja nur einmalig beim Überfahren des Buttons das Formular angezeigt werden. Wann genau soll es denn wieder verschwinden?
Ja, wenn man über den Button fährt, soll der Div erscheinen.
Jetzt gibt es 3 Möglichkeiten:
1. Wenn ich den Button verlasse, und in den Div komme, dann bleibt die Form da, weil der Nutzer ja was eingeben soll.
2. Wenn ich den Button nach oben, Rechts oder Links verlasse soll der Div verschwinden, weil ich ja davon Ausgehen kann, dass der Nutzer nichts eingeben will.
3. Wenn ich den Div verlasse soll der Div ebenfalls verschwinden.
Ich hoffe ihr wisst was ich meine. ;) -
ole-reglitzki schrieb:
Die Bedingungen sollte meine Methode erfüllen, ansonsten fällt mir nichts ein, wo auch beim Verlassen des Buttons nach links und rechts das Div verschwindet.
lg Ole
Du sollst das nicht wörlich nehemen mit dem Rechts, Links, bla bla. Sondern so: Wenn man den Button verlässt, ohne in den Div zu kommen. ;)
Ich hab auch versucht deine Methode anzuwenden, jedoch fährt nichts aus bzw. es fadet nichts in.
Beitrag zuletzt geändert: 20.7.2011 9:14:57 von pasi-b -
Am einfachsten wäre es, wenn du bei dem Button MouseOver das Formular einfadest und beim Formular MouseOut das formular ausblendest. Ein Beispiel habe ich online in Form eines Submenüs, aber das Prinzip ist das selbe: http://bit.ly/ooNgLN
-
trueweb schrieb:
Am einfachsten wäre es, wenn du bei dem Button MouseOver das Formular einfadest und beim Formular MouseOut das formular ausblendest. Ein Beispiel habe ich online in Form eines Submenüs, aber das Prinzip ist das selbe: http://bit.ly/ooNgLN
Funktioniert irgendwie auch nicht .... -
pasi-b schrieb:
trueweb schrieb:
Am einfachsten wäre es, wenn du bei dem Button MouseOver das Formular einfadest und beim Formular MouseOut das formular ausblendest. Ein Beispiel habe ich online in Form eines Submenüs, aber das Prinzip ist das selbe: http://bit.ly/ooNgLN
Funktioniert irgendwie auch nicht ....
doch -
das ist aber nicht genau das, was er will...
probier dann mal, bei
die 10 hinten durch eine höhere Zahl zu ersetzen, ob es dann klappt.var timeoutVariable = window.setTimeout("hide(500)", 10);
Das ist halt die Zeit in Millisekunden, die dem Browser bleiben, bis das Javascript die Funktion ausführt und dadurch nicht mehr gestoppt werden kann.
Eine Sekunde wären 1000 Millisekunden, aber ich denke, 100 sollten auf alle Fälle ausreichen.
Ich probier' es gleich mal selber ;) -
Form geht zwar weg, aber verschwindet sofort wieder
Beitrag zuletzt geändert: 20.7.2011 10:59:41 von pasi-b -
pasi-b schrieb:
Meine Form geht nicht weg ....
onMouseOut="$('this').hide(500);"
Da sind zwei ' zu viel, es muss lauten:
onMouseOut="$(this).hide(500);"
-
ole-reglitzki schrieb:
http://www.ole-reglitzki.lima-city.de/
Funktioniert doch gut...
Jo, bei mir aber nicht. Keine Ahnung wieso.... -
Den Quelltext hast du dir angeschaut?
Vielleicht deklarierst du die Variable erst in ieiner Funktion, weiß nicht, ob es dann klappt...
[edit] nein, dann klappt es nicht (getestet)
[edit 2] sonst schau doch mal in deine Fehlerkonsole (unter FF: Strg+Shift+J)
Beitrag zuletzt geändert: 20.7.2011 11:11:20 von ole-reglitzki -
Diskutiere mit und stelle Fragen: Jetzt kostenlos anmelden!
lima-city: Gratis werbefreier Webspace für deine eigene Homepage