• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Was ist der Fehler? -onMouseover

T

Tomme

Neues Mitglied
So, ich bin jetzt auch hier ;)

ich muss für die Schule eine Seite mit HTML und CSS erstellen. Jetzt bereitet mir der mouseover große Probleme.
Eigentlich soll über dem Hintergrundbild ein Bild erscheinen und wenn man mit der Maus darübergeht kommt statt dem Bild ein anderes(bzw ein Text im jpg Format).
Aber irgendwie klappt das alles nicht :(

<html>
<head>
</head>
<body>
<a href="http://www.google.de"
onMouseOver="document.Bild.src='TUGTAINtext.jpg';"
onMouseOut="document.Bild.src='Tbluejpg.jpg';">

<img src="WOFÜR?"
name="WOFÜR?"
width=500 height=200
alt="Demolink"
border=0>
</a>
xxx
<link rel="stylesheet" media="screen" href="gta.css">
xxx

</style>
</body>
</html>
 
Erstmal fehlt der Doctype, zweitensmal fehlt die Einleitung des Javascript bereichs und das ende..
das muss soweit ich weiß in Javascriptbereich also dann:
Code: 
<script type="text/javascript">
<!--
onMouseOver="document.Bild.src='TUGTAINtext.jpg';"
onMouseOut="document.Bild.src='Tbluejpg.jpg';">

//--></script>
bin mir allerdings nicht sicher ob der rest des codes stimmt.
 
Zuletzt bearbeitet:
Ich habs jetzt so gemacht, jetzt klappt gar nichts mehr :(

<html>
<head>
</head>
<script type="text/javascript">
<!--
onMouseOver="document.Bild.src='TUGTAINtext.jpg';"
onMouseOut="document.Bild.src='Tbluejpg.jpg';">

<img src="WOFÜR?"
name="WOFÜR?"
width=500 height=200
alt="Demolink"
border=0>
}
//-->
xxx
<link rel="stylesheet" media="screen" href="gta.css">
xxx

</style>
</body>
</html>
 
doctype fehlt immer noch
pardon hab bei dem Code n } zuviel und </sript> vergessen.
So ist der Script jetzt zumindestens vom Aufbau korrekt ob der inhalt stimmt bin ich mir net sicher
HTML: 
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<script type="text/javascript">
<!--
onMouseOver="document.Bild.src='TUGTAINtext.jpg';"
onMouseOut="document.Bild.src='Tbluejpg.jpg';">
//-->
</script>
</head>
<body>

<img src="WOFÜR?"
name="WOFÜR?"
width=500 height=200
alt="Demolink"
border=0>


xxx
<link rel="stylesheet" media="screen" href="gta.css">
xxx


</body>
</html>
 
Das ist ja auch falsch. Deine ursprüngliche Schreibweise für das JavaScript war schon richtig.

Wie schon erwähnt, fehlt dir ein Doctype, der die Browser in den Standardmode versetzt. Dieser hier wäre geeignet.
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
	"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Dann ist dein Grundgerüst noch fehlerhaft, es fehlt der body.

Deine Grafik kann nicht angezeigt werden, weil die Werte der Attribute falsch sind.
HTML: 
<img src="Pfad zum Bild.Dateiendung" alt="alternativer Text" />

Wenn du das Bild per JavaScript ändern willst, wenn sich die Maus darüber befindet, kannst du das so machen.
HTML: 
<img src="Pfad zum Bild.Dateiendung" alt="alternativer Text" onmouseover="this.src='Pfad zum neuen Bild.Dateiendung'" onmouseout="this.src='Pfad zum Bild.Dateiendung'"/>

Der Link für das Einbinden des CSS gehört in den <head>, nicht in den <body>
 
Okay, auch gemacht, der mouseover klappt immer noch nicht :(
trotzdem danke.
dann ists wahrscheinlich ein inhaltlicher Fehler, welche auch immer, vllt findet den ja jemand.
Der einzige Untershcied ist, dass vorher da wo der mouseover eigentlich sein sollte ein dünner Rahmen drum war, der ist jetzt weg. Zu sehen ist von dem Mouseovercode nur "Demolink"

EDIT: Das oben war die Antwort auf Imbericles Beitrag

So, klappt zwar immer noch nicht, aber mein Code sieht jetzt so aus:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<link rel="stylesheet" media="screen" href="gta.css">
</head>
<body>
<img src="TUGTAINtext.jpg" alt="alternativer Text" onmouseover="this.src='Tblue.jpg'" onmouseout="this.src='TUGTAINtext.jpg'"/>
xxx
xxx

</style>
</body>
</html>



EDIT2: Klappt doch mehr als vorher!!! Jetzt wird mir TUGTAINtext.jpg angezeigt, Tblue fehlt allerdings noch.

EDIT3: Klappt jetzt komplett! Hatte einen falschen Dateinamen eingegeben. SUPER!DANKE!
 
Zuletzt bearbeitet:
Dann hast du was falsch gemacht, mein Beispiel funktioniert. Hast du mal nen Link zu deiner Seite, damit man sich das mal ansehen kann?
 
Wie gesagt, jetzt klappts (fast).
Das einzige Problem bis jetzt bleibt, dass man nur einmal über das Bild gehen kann und das zweite Bild dann die ganze Zeit bleibt. Kann man das noch ändern?

vielleicht liegt das ja daran, dass das eine bild eher quadratisch ist und das zweite lang.
 
hab eigentlich alles so gemacht wie du gesagt hast, hier nochmal der Code(nicht wundern wenn die dateinamen sich verändert haben):
HTML: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html>
<head>
<link rel="stylesheet" media="screen" href="gta.css">
</head>
<body>
<img src="Tbluejjp.jpg" alt="alternativer Text" onmouseover="this.src='k-erste.jpg'" onmouseout="this.src='Tbluejjp'"/>
xxx
xxx

</style>
</body>
</html>
 
Das </style> gehört da nicht hin, weil du es nirgends öffnest und die 'x' gehören auch noch in ein Tag oder gelöscht. Abgesehen davon, sollte es funktionieren.

Wenn nicht, lade das Beispiel mal auf einen Webspace und gib uns den Link.
 
Okay habs :)

ein ".jpg" vergessen.


Jetzt die nächste Frage - kann man mehrere Mouseovers an bestimmte Stellen auf einer Site bringen?
 
Ja, du kannst jedem Element ein mouseover geben, mir fällt zumindest jetzt keins ein, bei dem es nicht erlaubt wäre.
 
Hier ein Rapidshare-Link zu der Datei
RapidShare: Easy Filehosting

Wenn ihr da den Mouseover sieht muss der praktisch etwas weiter nach unten auf das passende Bild. Geht das? und wie gesagt halt mehrere Mouseovers auf die Seite.

Ich brauch das wirklich dringen und möchte das jetzt heute so schnell wie möglich fertig haben. Danke.
 
Das Problem ist, dass ich nciht weiß wie man den Mouseover an eine bestimmte Stelle auf der seite bekommt. jetzt ist er immer rechts oben.
 
Er ist an der Stelle in deinem Viewport, an der sich das Element befindet, welches du mit einem mouseover-Event versehen hast.
 
_Thor_ schrieb:
Er ist an der Stelle in deinem Viewport, an der sich das Element befindet, welches du mit einem mouseover-Event versehen hast.
Zum Vergrößern anklicken....
Viewport? Was ist das?
Ich hab ja meinen HTML Code hier hinkopiert.

<img src="mouseoverbild1.jpg" alt="alternativer Text" onmouseover="this.src='mouseovertext1.jpg'" onmouseout="this.src='mouseoverbild1.jpg'"/>
Da steht ja nirgendwo was von einer speziellen Stelle.

Wie bekomm ich das irgendwo speziell hinplatziert?
 
Der Viewport ist der Bereich in deinem Browser, in den die Webseite angezeigt wird.

Du hast jetzt für das Bild ein mouseover hinzugefügt, d.H. das JavaScript reagiert nur drauf, wenn sich die Maus über dem Bild befindet, egal an welcher Stelle es sich befindet.

Wenn du es an einer bestimmten Stelle auf deiner Seite haben möchtest, positionierst du entweder ein Element an der Stelle, oder du fragst per Javascript die Position der Maus ab und wenn sie sich innerhalb der gewünschten Koordinaten befindet, führst du deinen Code aus.
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben