Bild onMouseOver einblenden

rocco · 21.02.2008, 09:40

Ich möchte dass beim "drüberfahren" mit der Maus über ein Bild das Bild erscheint und beim "verlassen" des Mauszeigers des Bildes das Bild wieder verschwindet. Mein erster Versuch war folgender:

Code:

[img]schluessel.gif[/img]

Am Beginn ist das Bild ja zu sehen. Fahre ich mit der Maus nun vom Bild weg, verschwindet es wie gewollt. Also das onMouseOut funktioniert.
Fahr ich jetzt mit dem Mauszeiger wieder über die Stelle an der das Bild vorher war, kommt leider nichts mehr.
Bisschen im Inet "gestöbert" und so sah mein zweiter Versuch aus:

Code:

<div id="schluesselbox" style="position:absolute; left:10px; top:10px; height:50px; width:50px;" onMouseOver="document.getElementById('schluessel').style.visibility='visible'" onMouseOut="document.getElementById('schluessel').style.visibility='hidden'">
[img]schluessel.gif[/img]
</div>

Mit dieser Methode passiert garnichts...

Bitte um Hilfe!
Grüße, Rocco

cycap · 21.02.2008, 09:51

Versuch doch einfach die SRC auf ein durchsichtiges Bild zu setzen

rocco · 21.02.2008, 09:53

Danke, das ist mir auch schon vorgeschwebt. Aber ich wollte es so lösen (ich finds eleganter

) In der Zwischenzeit werd ichs mal so machen...

cycap · 21.02.2008, 11:22

Also ich hab gerade mal deinen zweiten Code kopiert. Wenn du getElementById benutzt sollte das IMG auch ne id haben. Die hab ich hinzugefügt und es funktioniert einwandfrei...

Makuro · 21.02.2008, 12:15

ansonsten einfach getElementByID mit getElementByName austauschen

Code:

<div id="schluesselbox" style="position:absolute; left:10px; top:10px; height:50px; width:50px;" onMouseOver="document.getElementByName('schluessel').style.visibility='visible'" onMouseOut="document.getElementByName('schluessel').style.visibility='hidden'">
[img]schluessel.gif[/img]
</div>

rocco · 21.02.2008, 12:38

...hilft leider auch nix

Makuro · 21.02.2008, 12:50

nur mal ein paar Grundlegende Fragen...

welchen Browser verwendest du denn zum anschauen?
hat der Browser auch Java bzw. Jscript/Javascript aktiviert?

nikosch · 21.02.2008, 16:35

Möglicherweise wird beim Setzen von visibility das Element so ausgeblendet, dass Mouseover Aktionen nicht mehr wirken (dachte bisher, das sei nur bei display:none; der Fall). Setz doch ein Hintergrundbild eines divs, statt ein Image Tag zu verwenden.

rocco · 22.02.2008, 12:52

Danke für die Antwort nikosch. Ich habs inzwischen mit einer transparenten Grafik gelöst. Werde es bei Zeiten probieren. Danke!

Browser: FireFox, JS natürlich aktiviert (sonst würd das ausblenden ja schon nicht funktionieren)

Grüße

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
Es erscheint das alte Bild (cache problem) !!	mac	PHP-Fortgeschrittene	12	18.05.2011 11:23
Transparentes Bild über Bild legen update gelöst	Broadcast	PHP-Fortgeschrittene	11	04.02.2008 15:27
[Erledigt] Nächstes Bild, Vorheriges Bild in PHP mit MySQL		Datenbanken	2	15.05.2006 20:50
[Erledigt] Bild immerwieder holen		PHP Tipps 2006	2	18.02.2006 01:24
[Erledigt] Text in Bild dynamisch rechtsbündig einblenden??		PHP Tipps 2005-2	16	27.12.2005 18:27
Horizontaler Bilder-Scroller mit Vergrößerung (OnMouseover)?		HTML, Usability und Barrierefreiheit	5	09.09.2005 09:03
Designproblem: Text und Bild	Sirke	HTML, Usability und Barrierefreiheit	2	08.09.2005 14:59
[Erledigt] Bild aus Datei in Bild einfügen		PHP Tipps 2005-2	1	07.08.2005 23:36
[PHP«Image] Bild in ein anderes Bild einsetzen		PHP Tipps 2005-2	4	07.08.2005 19:39
[Erledigt] Bild Langsam Einblenden		HTML, Usability und Barrierefreiheit	1	03.02.2005 23:04
[Erledigt] [JS]Neues Bild in neuem Fenster öffnen		HTML, Usability und Barrierefreiheit	1	04.01.2005 11:39
Bild aus Server anzeigen lassen	flual2000	PHP Tipps 2004	4	26.10.2004 16:33
Bild größe hat prob mit umbenennung.	JEGO	PHP Tipps 2004	1	08.07.2004 16:30
tabelle mit onmouseover einblenden lassen		HTML, Usability und Barrierefreiheit	9	30.06.2004 13:08

21.02.2008, 09:40
rocco Erfahrener Benutzer Registriert seit: 30.04.2004 Beiträge: 225	Bild onMouseOver einblenden Ich möchte dass beim "drüberfahren" mit der Maus über ein Bild das Bild erscheint und beim "verlassen" des Mauszeigers des Bildes das Bild wieder verschwindet. Mein erster Versuch war folgender: Code: [img]schluessel.gif[/img] Am Beginn ist das Bild ja zu sehen. Fahre ich mit der Maus nun vom Bild weg, verschwindet es wie gewollt. Also das onMouseOut funktioniert. Fahr ich jetzt mit dem Mauszeiger wieder über die Stelle an der das Bild vorher war, kommt leider nichts mehr. Bisschen im Inet "gestöbert" und so sah mein zweiter Versuch aus: Code: <div id="schluesselbox" style="position:absolute; left:10px; top:10px; height:50px; width:50px;" onMouseOver="document.getElementById('schluessel').style.visibility='visible'" onMouseOut="document.getElementById('schluessel').style.visibility='hidden'"> [img]schluessel.gif[/img] </div> Mit dieser Methode passiert garnichts... Bitte um Hilfe! Grüße, Rocco


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

21.02.2008, 09:51
cycap Moderator Registriert seit: 13.02.2008 Beiträge: 6.816 PHP-Kenntnisse: Fortgeschritten	Versuch doch einfach die SRC auf ein durchsichtiges Bild zu setzen

21.02.2008, 09:53
rocco Erfahrener Benutzer Registriert seit: 30.04.2004 Beiträge: 225	Danke, das ist mir auch schon vorgeschwebt. Aber ich wollte es so lösen (ich finds eleganter ) In der Zwischenzeit werd ichs mal so machen...

21.02.2008, 11:22
cycap Moderator Registriert seit: 13.02.2008 Beiträge: 6.816 PHP-Kenntnisse: Fortgeschritten	Also ich hab gerade mal deinen zweiten Code kopiert. Wenn du getElementById benutzt sollte das IMG auch ne id haben. Die hab ich hinzugefügt und es funktioniert einwandfrei...

21.02.2008, 12:38
rocco Erfahrener Benutzer Registriert seit: 30.04.2004 Beiträge: 225	...hilft leider auch nix

21.02.2008, 12:50
Makuro Neuer Benutzer Registriert seit: 20.02.2008 Beiträge: 8	nur mal ein paar Grundlegende Fragen... welchen Browser verwendest du denn zum anschauen? hat der Browser auch Java bzw. Jscript/Javascript aktiviert?

21.02.2008, 16:35
nikosch moderatives Dielektrikum Registriert seit: 21.05.2008 Beiträge: 34.256 PHP-Kenntnisse: Fortgeschritten	Möglicherweise wird beim Setzen von visibility das Element so ausgeblendet, dass Mouseover Aktionen nicht mehr wirken (dachte bisher, das sei nur bei display:none; der Fall). Setz doch ein Hintergrundbild eines divs, statt ein Image Tag zu verwenden.

22.02.2008, 12:52
rocco Erfahrener Benutzer Registriert seit: 30.04.2004 Beiträge: 225	Danke für die Antwort nikosch. Ich habs inzwischen mit einer transparenten Grafik gelöst. Werde es bei Zeiten probieren. Danke! Browser: FireFox, JS natürlich aktiviert (sonst würd das ausblenden ja schon nicht funktionieren) Grüße