Bild erscheinen lassen mit Maus

11/19/2015 17:58 Vincii#1
Hallo liebe Epvp-Community,

Wir haben einen Wettbewerb an der Uni und sollen eine Homepage erstellen.
Nun haben wir nur eine Vorlesung über HTML dafür gehabt. Wir dürfen aber alles mögliche dafür verwenden. Meine Frage ist nun ob jemand weiß,
wie man es programmiert, dass wenn der Benutzer mit der Maus über dem Bild Beruflich bzw. Privates ist, das Bild 1 bzw. das Bild 2 erscheint (rote Markierungen an der Stelle). Ich habe zwar bisher alles in einem HTML-Skript gemacht, aber bin offen für alle andere Sprachen, hauptsache es löst mein Problem.

[Only registered and activated users can see links. Click Here To Register...]
bzw. Link falls was: [Only registered and activated users can see links. Click Here To Register...]

Vielen Dank im Voraus für die Hilfe!
MfG
Vincii
11/19/2015 19:32 papierkorp#2
Also ich bin jetzt nicht unbedingt der Javascript Profi, bin noch am lernen :D aber es sollte mit dem onmouseover Event funktionieren:

[Only registered and activated users can see links. Click Here To Register...]

lg
11/19/2015 19:35 Vincii#3
Quote:
Originally Posted by papierkorp View Post
Also ich bin jetzt nicht unbedingt der Javascript Profi, bin noch am lernen :D aber es sollte mit dem onmouseover Event funktionieren:

[Only registered and activated users can see links. Click Here To Register...]

lg
Danke erstmal! Das habe ich auch gefunden, das Problem ist aber 1. Wie lasse ich ein anderes Bild an einer anderen Stelle erscheinen und 2. ohne dass alles andere verrutscht(wegen <br>)?
11/21/2015 13:30 Undaground#4
Hier eine JS Lösung für copy & paste

[Only registered and activated users can see links. Click Here To Register...]
11/21/2015 18:19 ~ JWonderpig ~#5
Quote:
Originally Posted by Vincii View Post
2. ohne dass alles andere verrutscht(wegen <br>)?
ohne <br> arbeiten :p

Hier eine einfache jQuery-Variante (ungetestet):
Code:
$('#navigation_item_id').on('mouseover', function() {
     $('#bild1').attr('src', 'pfad zum neuen Bild');
     $('#bild2').attr('src', 'pfad zum neuen Bild');
});
#navigation_item_id einfach durch die ID eines Elementes aus der Navigation ersetzen. Bild1 und Bild2 durch die ID der IMG-Elemente ersetzen.