hi alle!
ich schreibe mir meine hp selbst und wollte auf meiner bilderseite die funktionen onmouseover/onmouseout verwenden. bei der kontrolle nach der veröffentlichung stellte sich heraus, daß der internet explorer diese funktion interpretiert, firefox aber nicht. darüber bin ich sehr traurig.
kann mir jemand sagen, ob und was ich falsch mache? vielleicht hat ja jemand die 2 min sich den quelltext anzuschaun: http://www.mein-bauwagen.de.
ich würde mich sehr freuen, vielen dank.
thomas
onmouseover/onmouseout
-
ThomasBS -
6. April 2006 um 11:26 -
Erledigt
-
Hallo,
ganz spontant fällt mir auf, dass keine End-Tags vorhanden sind.
Zitat
<img src="Bild_Blitz.jpg" onmouseover ="this.style.zoom='300%' "
onmouseout ="this.style.zoom='100%' "
height=150 align=500></img>Zwar nicht absolut zwingend vorgeschrieben, aber auf jeden Fall besser.
Hast Du schon versucht, mal einen "Hook" einzubauen, damit Du siehst, ob die JS überhaupt abgearbeitet wird ?
.... onmouseover="alert('bin drinnen')" ....
Generell ist das Verhalten von .zoom mitunter sehr spekulativ, serverbestimmt, aber auch hinsichtlich Browser.
Was ich nicht gefunden habe, sind Deine Stylesheets, wobei das an meinem Validator liegen kann, der mag heute irgendwie nicht so richtig.
Vielleicht postest Du sie einfach mal hier rein. -
das liegt am zoom. das ist ein IE-only befehl.
http://msdn.microsoft.com/workshop/autho…erties/zoom.asp
Ich mein mich daran erinnern zu können das das auch für eines der css3-module im gespräch ist. aber das wird noch dauern, bevor das irgendeinanderer browser ausser IE beherrschen wird. -
wenn Du unbedingt die Grafik vergrössern möchtest beim Mauskontakt, kansnt Du auch mit 2 Bildern arbeiten und die dann überlagern.
Geht relativ leicht über Javascript (bei mouseover das grössere Bild reinblenden, bei mouseout wieder das kleinere). -
Überlagern? Schiessen wir neuerdings mit Kanonen auf Spatzen?
ZitatAlles anzeigen<img
src="Bild1.jpg"
style="width:300px; height:200px;"
onmouseover="
this.src='Bild2.jpg';
this.style.width=parseInt(this.style.width)*3+'px';
this.style.height=parseInt(this.style.height)*3+'px';"
onmouseout="
this.src='Bild1.jpg';
this.style.width=parseInt(this.style.width)/3+'px';
this.style.height=parseInt(this.style.height)/3+'px';
">
In den orangen Stellen die Adresse des kleinen Bilds eintragen. Im roten die des grossen Bilds. Falls nur ein Bild vorhanden ist, einfach die Zeilen mit dem this.src löschen.Mit den blauen Angaben, bestimmt man die Ursprungsgrösse des <img>. Die violetten Zahlen gibt man den "zoomfaktor" an. Diese müssen alle identisch sein, und immer möglichst Ganzzahlen (also keine Kommastellen). Falls benötigt, kann man das auch einbauen.
-
bugcatcher
1000mal sorry für die Wortwahl "überlagern".
Gemeint ist das gleiche, oder ?Wobei mir als Grosswildjäger natürlich nicht klar ist, wo der Unterschied ist, zwei Bilder zu laden und dann einfach mit den mouse*-Events das Bild zu tauschen, oder das Bild beim mouse*-Event zu laden und dann zu tauschen.
Aber Du bist der Codeprofi, nicht ich: somit nehme ich es dankend&lernend zur Kenntnis :wink: -
Überlagern heisst für mich Layer-Technik. Sowas ist grundsätzlich schonmal Pfui. Wenn Du "Austauschen" meinst, musst Du das auch sagen. ; )
Man kann da ne menge machen, aber ich habs versucht einfach zu halten. Z.B. wird das 2. Bild nicht vorgeladen. Aber das würde schnell sehr umfang reich werden, weswegen ich das einfach mal weggelassen hab.
-
schon ok, Layer mag/mache ich auch nie (oder sagen wir: schon lange nicht mehr).
Salute