Bild ändern, wenn die Maus auf dem Bild ist

Cami at 10h10
14
Jan
2011
[center]Hallo ihr Lieben,

ich habe mich schon hier durch das Forum gesucht wie aber auch durchgegoogelt und leider Ergebnisse gefunden, die ich nicht erfolgreich übernehmen konnte.

Ich möchte gerne auf meiner Portalseite ein Modul erstellen, dass 3 Verlinkungen beinhaltet.

Als erste Verlinkung hätte ich gern diese URL: http://www.aeriagames.com/forums/de/viewtopic.php?t=65837

Das Bild und die Verlinkung habe ich hinbekommen. Das Bild soll dieses sein: http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif

Jetzt möchte ich nur, wenn ein Benutzer des Forums auf dieses Bild mit dem Mauszeiger geht, das Bild sich in dieses Bild verändert: http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif

Einen entprechenden HTML-Code habe ich bereits gefunden, doch leider zeigt es mir nicht den erwünschten Effekt an.

Ich wäre für einen HTML-Code für das Modul sehr dankbar!

Liebe Grüße und vielen Dank im Voraus

Cami
Antworten
1 Zuckerpuppe, am 14/01/2011 at 10h55
Hallo,

setz das mal so ein...das sollte passen Smile
Code:
<html>
<head>
<script
language="JavaScript">
<!--
button1= new Image();
button1.src = "http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif"
button2= new Image();
button2.src = "http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif"
//-->
</script>
</head>
<body>
<a href="http://www.aeriagames.com/forums/de/viewtopic.php?t=65837"
onmouseover="austausch1.src='http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif';"
onmouseout="austausch1.src='http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif';">
<img src="http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif" border="0" name="austausch1">

</body>
</html>

2 Cami, am 14/01/2011 at 11h19
Lieben Dank für die schnelle Hilfe!

Aber eine Frage interessiert mich noch:

Wenn ich 2 weitere Links einfügen möchte mit weiteren Bildern, die ebenfalls sich ändern, wenn der Mauszeiger darauf ist, kann ich das obige Script einfach noch mal 2 Mal verwenden mit den anderen Angaben? Oder müsst ich das Script erweitern?

Lieben Dank für die Antwort im Voraus!

Cami
3 Zuckerpuppe, am 14/01/2011 at 11h36
nein, wenn du das gleiche Script ein zweites Mal genau so einsetzt, funktioniert das nicht..
du musst das bisherige Script erweitern Smile

Beispiel mit einer zweiten Grafik, die sich beim Mouseover verändern soll:
(ich habe jetzt mal auf die Schnelle die gleichen Bilder verwendet..)
Code:
<html>
<head>
<script
language="JavaScript">
<!--
button1= new Image();
button1.src = "http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif"
button2= new Image();
button2.src = "http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif"
button3= new Image();
button3.src = "http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif"
button4= new Image();
button4.src = "http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif"
//-->
</script>
</head>
<body>
<a href="http://www.aeriagames.com/forums/de/viewtopic.php?t=65837"
onmouseover="austausch1.src='http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif';"
onmouseout="austausch1.src='http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif';">
<img src="http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif" border="0" name="austausch1">
<a href="http://www.aeriagames.com/forums/de/viewtopic.php?t=65837"
onmouseover="austausch3.src='http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif';"
onmouseout="austausch3.src='http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif';">
<img src="http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif" border="0" name="austausch3">

</body>
</html>

4 Cami, am 14/01/2011 at 12h13
Oh weh, ich glaub, das wird bei mir ne schwere Geburt!

Ich bin gerade dabei die anderen beiden Bilder (Buttons) fertigzustellen, um die dann auf eine Verlinkung zu setzen.

Ich hab dein zweites Script mal eingefügt und leider bemerkt, dass die Verlinkungen und somit die Bilder nebeneinander stehen. Ich hätt sie jedoch gern untereinander! :-( *duck vor Haue*

Schau mal hier: http://darksiders.youneed.us/ So sollte es aussehen in der Anordnung!
5 Cami, am 14/01/2011 at 12h37
.
6 Zuckerpuppe, am 14/01/2011 at 12h49
wenn die Grafiken untereinander stehen sollen, dann musst du einfach ein HTML-tag für eine Leerzeile eingeben...also <br>
Ich habe es im Code mal farbig markiert. Wenn du größere Abstände möchtes, dann musst du eben noch mehr davon einfügen Wink

<html>
<head>
<script
language="JavaScript">
<!--
button1= new Image();
button1.src = "http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif"
button2= new Image();
button2.src = "http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif"
button3= new Image();
button3.src = "http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif"
button4= new Image();
button4.src = "http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif"
//-->
</script>
</head>
<body>
<a href="http://www.aeriagames.com/forums/de/viewtopic.php?t=65837"
onmouseover="austausch1.src='http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif';"
onmouseout="austausch1.src='http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif';">
<img src="http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif" border="0" name="austausch1">
<br>
<a href="http://www.aeriagames.com/forums/de/viewtopic.php?t=65837"
onmouseover="austausch3.src='http://img40.imageshack.us/img40/7292/gildenvorstellung2.gif';"
onmouseout="austausch3.src='http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif';">
<img src="http://img810.imageshack.us/img810/2208/gildenvorstellung1.gif" border="0" name="austausch3">
</body>
</html>
7 Cami, am 14/01/2011 at 13h04
Lieben Dank,

hat prima geklappt! Ick bin fertig hier! Wink
Similar topics
Galerie: auf Startseite Info, wenn es ein neues Bild gibt?
Wollte mal wissen, ob man irgendwie eine Info auf der Startseite einbauen kann, wenn es in der Galerie neue Bilder gibt? So, wie bei neuen Beiträgen. Am besten sogar, wenn angezeigt wäre, wie viele neue Bilder in welchem Album. Mir würde es sonst
Buttons verändern sich wenn Maus drüberfährt
Hey Leute, habe im Forum die ganze zeit nach so nem Beitrag gesucht - nur dass ihr's wisst XDDD aber in puncto suchen bin ich von vorn herein ne niete ;-/ Also ich wollte gern wissen, wie man die Buttons so abändern kann, in einem Script oder was,
Bild zu groß
Hallo, ich habe ein neues Bild auf die Startseite gesetzt, aber es ist zu groß. Ich möchte es gern kleiner haben, weiß aber nicht (mehr) wie ich das machen kann. Das Bild, welches ich vorher dort hatte, war gut in der Größe, aber wenn ich es jetzt
Siehe auch
more_less
Informations

7 Antworten For the topic :
"Bild ändern, wenn die Maus auf dem Bild ist"

This topic has been viewed 721 times.

Last message :
14/01/2011 at 10h10 von "Cami"