Onmouseover: Bedienfeld in Container einblenden

Computer: Software & Programmierung HTML & CSS
#1

Hallo zusammen,

ich habe ein Problem:

Ich habe einen Div-Container, in dem ein Bild ist.
Wenn ich nu mit der Maus über dieses Bild fahre, soll ein (neues) Bild eingeblendet werden, mit dem ich via href und klick etwas steuern kann.

Bisher war mein Lösungsansatz, hierfür eine JS-Funktion zu nutzen, die onmouseover onmouseout style.display = „block“ / bzw. „none“ ausführte.
Das hat aber den Nachteil, dass bei jeder Mausbewegung innerhalb des Containers das einzublendende Bild flackert/flasht und der Link nicht klickbar ist.

Dann habe ich versucht, das Problem mit CSS zu umgehen:
#apDiv303 {…}
#apDiv303:hover {…}
Allerdings mag es nicht gelingen, das verwendete background-img klickbar zu machen.

Wer weiss mir einen Rat?

Vielen Dank schonmal

Grüße

Midir

#2

Hallo Midir,

Ich habe einen Div-Container, in dem ein Bild ist.
Wenn ich nu mit der Maus über dieses Bild fahre, soll ein
(neues) Bild eingeblendet werden, mit dem ich via href und
klick etwas steuern kann.

mit onmouseover und -out kannst Du doch das innerHTML ändern, ohne flackern. z.B:


 normale Ansicht

Für komplexere Änderungen bietet es sich an, eine JS-Function, die diese Änderungen per document.getElementById(‚test‘).innerHTML= „“ übernimmt, mit dem onmouseover und -out aufzurufen.

Gruß
Klaus

#3

Hallo Klaus,

vielen Dank für Deine Antwort.
Ich habe es ausprobiert, aber leider flackert das immer noch. Ich habe es nun aufwendiger gelöst, und einen Roll-Over Effekt programmiert (Dreamweaver :wink: ) Eben leider mit dem Nachteil, dass ich nur einen Link hinterlegen kann…

Grüße

Midir

#4

Hallo Midir,

hast Du denn die events auf das DIV gelegt?
Mich würde sehr interessieren, wieso das dann flackert.
Mail doch mal das HTML.

Gruß
Klaus

#5

Hallo Klaus,

der Ansatz mit this.InnerHTML war nicht schlecht!!
ABER: Ich habe 2Div-Container. Im Div 1 ist ein Bild, und wenn mouseover, dann soll eine Linkliste eingeblendet werden…
#1 google und im Hintergrund z.B. dieser Link: (http://www.google.de)
#2 Schorsch … (http://www.yahoo.de) usw usw usw.

Mein Ansatz war:

Wo um alles in der Welt mach ich den Fehler???

Sorry, aber ich hab mir die Finger wund gegoogelt… nix… Kannst Du oder irgendwer sonst mir helfen?

Vielen Dank im Voraus

Grüße

Midir