onMouseover ?!

[fibu]

Hallo zusammen,
ich möchte, dass wenn ich die maus über ein bild bewege ein anderes angezeigt wird. Wie geht das?

irgend was in die richtung??: onMouseOver

mfg

[nag]

Hallo,

ich möchte, dass wenn ich die maus über ein bild bewege ein anderes angezeigt wird. Wie geht das?

wenn es um Bilder geht:
http://de.selfhtml.org/javascript/beispiele/buttons.htm

wenn es aber um Link-Bilder geht, dann kannst du das mit der CSS-Pseudoeigenschaft :hover realisieren.
[http://de.selfhtml.org/css/eigenschaften/pseudoformate.htm#link_visited_hover_active_focus]

mfg NAG

[Orlando]

Hi fibu,

ich möchte, dass wenn ich die maus über ein bild bewege ein anderes angezeigt wird. Wie geht das?
irgend was in die richtung??: onMouseOver

dafür reicht die CSS-Pseudo-Klasse :hover, Javascript ist nicht notwendig.

http://aktuell.de.selfhtml.org/artikel/css/mouseover/#a4
 -> http://aktuell.de.selfhtml.org/artikel/css/mouseover/beispiel5.htm

Grüße,
 Roland

[fibu]

Hiho,

also ich bin nich grad der css pro ... wie geht das denn für ein normales bild, also nich backgrund-image?

<style>
   a       { display:block;
             background-image:url(button.gif);
             width:120px; height:30px }
   a:hover { background-image:url(button_on.gif); }
</style>

mfg

[Orlando]

Hi fibu,

wie geht das denn für ein normales bild, also nich backgrund-image?

mit CSS gar nicht.

Grüße,
 Roland

[Dennis]

Hi Orlando,

wie geht das denn für ein normales bild, also nich backgrund-image?

mit CSS gar nicht.

Deshalb: Erstelle einfach z.B. ein Div, dem du width und height vom Bild gibst, wo du dann das Bild als Hintergrund reintust, dann funktioniert auch alles mit dem :hover.

MfG, Dennis.

[Cybaer]

Hi,

dafür reicht die CSS-Pseudo-Klasse :hover, Javascript ist nicht notwendig.

Wobei ich doch *dringend* auf die auch genannten Nachteile hinweisen möchte!

Kein CSS = überhaupt nichts sichtbar! :-(

Und man kann sich, außer vielleicht in Intranet-Umgebungen, in keinster Weise darauf verlassen, daß selbst aktuelle Browser dieses CSS interpretieren.

IMHO ist nur die JavaScript-Methode tauglich ...

Gruß, Cybaer

[Struppi]

dafür reicht die CSS-Pseudo-Klasse :hover, Javascript ist nicht notwendig.

Wobei ich doch *dringend* auf die auch genannten Nachteile hinweisen möchte!

Kein CSS = überhaupt nichts sichtbar! :-(

Du meinst welche Browser?
und hier sind z.b. Suchmaschinen wesentlich besser bedient, da der code ja HTML ist. Lediglich NC 4 versagt bei den Pseudoklassen

Und man kann sich, außer vielleicht in Intranet-Umgebungen, in keinster Weise darauf verlassen, daß selbst aktuelle Browser dieses CSS interpretieren.

sogar IE 4 zeigt hier zumindest etwas an:
http://home.arcor.de/struebig/computer/javascript/exp/test/css-mouseover.html

IMHO ist nur die JavaScript-Methode tauglich ...

Kommt drauf an wofür. zumindest ist die Wahrscheinlichkeit, das JS ausgeschaltet oder gefiltert wird größer als das der Browser kein CSS kann

Struppi.

[Struppi]

vergiß es, ich hab die Frage falsch verstanden.

Struppi.

[Dennis]

Hi Struppi,

Mal noch eine kleine Anmerkung zu deiner Scriptsammlung:
http://home.arcor.de/struebig/computer/javascript/index.html

Ich klicke auf den Button Valid HTML 4.0 - und was sehe ich?

Diese Seite ist nicht Valid HTML 4.0 Strict. ;-)

Da nimm das Zeichen doch lieber weg - ich fände so was nämlich
ein bisschen peinlich *g*

MfG, Dennis.

[Struppi]

Mal noch eine kleine Anmerkung zu deiner Scriptsammlung:
http://home.arcor.de/struebig/computer/javascript/index.html

Ich klicke auf den Button Valid HTML 4.0 - und was sehe ich?

Diese Seite ist nicht Valid HTML 4.0 Strict. ;-)

danke, für den Hinweis.

Das lag an dem Zähler den ich mir gestern gegönnt habe, den brauch ich fürmein ego ;-)

Da nimm das Zeichen doch lieber weg - ich fände so was nämlich
ein bisschen peinlich *g*

Ich find den sehr nützlich, so kann ich jederzeit sehen, wenn ich einen Fehler gemacht habe.

Struppi.

[Cybaer]

Hi,

vergiß es, ich hab die Frage falsch verstanden.

Zu spät ... =:-o

Gruß, Cybaer

[Cybaer]

Hi,

Du meinst welche Browser?

Den Broser, mit dem der Surfer die Site ansurft, ohne mich vorher zu fragen! ;-)

und hier sind z.b. Suchmaschinen wesentlich besser bedient, da der code ja HTML ist.

? HTML ist es sowieso. Nur entweder *ergänzt* um CSS oder JS -und bei CSS halt (logischerweise) weniger HTML, als bei der JS-Variante.

BTW: Indizieren Suchmaschinen nicht nur "HTML-Images", sondern auch "CSS-Images"?

Lediglich NC 4 versagt bei den Pseudoklassen

Oder der IE, wenn es sich nicht um Links handelt, oder generell Browser mit deaktivierten CSS, bzw. gar ganz ohne CSS.

Du weißt halt nicht, welchen Browser der Surfer benutzt. Wenn Du es wirklich (mindestens ansatzweise) rausfinden kannst, hast Du JavaScript - dann kann man auch gleich die JS-Variante verwenden. :-)

Kommt drauf an wofür.

Es kommt *immer* drauf an. :-))

Und noch 'ne Binsenweisheit: Man sollte potentielle User nicht ausschließen. ;-) Techniken die das tun, sollte man nicht zur Problemlösung heranziehen, sondern andere Lösungen bemühen. Das Credo in diesem Fall: "nur optional" (gilt nicht nur für JS).

zumindest ist die Wahrscheinlichkeit, das JS ausgeschaltet oder gefiltert wird größer als das der Browser kein CSS kann

Aber wenn JavaScript ausgeschaltet ist und wenn der Browser kein CSS kann (wir hatten hier ja gerade erst den Thread mit dem PDA unter Windows Mobile 2003, dessen IE 6 weder JS noch CSS beherrscht), dann sieht man bei der CSS-Lösung gar nichts, bei der JS-Lösung wenigstens die Original-Grafik.

Gruß, Cybaer

PS: Kommt doch nicht so gut, wenn man z.B. "protzt", man hätte auf der Site die neueste Technik eingesetzt, damit es auch ohne JS optimal aussieht. Und der Chef, der seinen PDA gleich mal auprobiert, sieht dann nüscht. =;->

[H2O]

Hallo.

Hallo zusammen,
ich möchte, dass wenn ich die maus über ein bild bewege ein anderes angezeigt wird. Wie geht das?

irgend was in die richtung??: onMouseOver

Bei JS sieht das so aus:
<img src="bild1.gif" onMouseOver="this.src='bild2.gif'">

Und wenn du dann auch noch willst, dass wieder die alte Grafik kommt geht das so:
<img src="bild1.gif" onMouseOver="this.src='bild2.gif'" onMouseOut="this.src='bild1.gif'">

Das hättest du aber auch selber herausfinden können.

Aber ich rate dir auch das mit CSS zu machen, wie Orlando es schon erklärt hat.

Ich hoffe ich konnte helfen, H2O

[fibu]

Hallo,
es funktioniert !!
das ist super, vielen Dank
mfg

[Quidoff]

http://mitglied.lycos.de/mrcalhoun/startseite.php
Hier hab ich so was gemacht.