nicht angemeldet
Hintergrundsbild in einer Tabelle per JS verändern
Hallo,
ich habe eine Tabelle, die ein Hintergrundsbild hat, in dieser Tabelle ist ein Text-Link, ich möchte per mouseover dieses Bild ändern. Ich weiss per:
<a onmouseover="document.images[01].src='bild_neu.gif'" onmouseout="document.images[01].src='bild_alt.gif'" href="datei.htm">Textlink</a>
eigentlich jedes Bild auf einer Seiten ansprechen und ändern kann, nur leider keine Tabellenhintergrundsbilder. :(
Weiss jemand Rat? Kann mir jemand helfen?
Danke,
MfG Thomas B
-
Hallo Thomas,
ich habe eine Tabelle, die ein Hintergrundsbild hat, in dieser Tabelle ist ein Text-Link, ich möchte per mouseover dieses Bild ändern.
Ich würde es nicht mit JS sondern mit CSS machen: http://aktuell.de.selfhtml.org/artikel/css/mouseover/index.htm#a7
hat zwar den Nachteil, daß es nicht mit NS4x geht, aber ansonsten nur Vorteile, weil es auch bei deaktivierten JS funktioniert.Grüße aus Nürnberg
HarryS -
Hallo Thomas,
ich habe eine Tabelle, die ein Hintergrundsbild hat, in dieser Tabelle ist ein Text-Link, ich möchte per mouseover dieses Bild ändern.
du musst der Tabelle eine id verpassen und mit getElementById("iddertabelle") arbeiten:
<a href="..."
onMouseOver='document.getElementById("bla").style.backgroundImage = "url(bild_neu.gif)"'
onMouseOut='document.getElementById("bla").style.backgroundImage = "url(bild_alt.gif)"'>...</a>
wobei 'bla' die id der Tabelle ist :-)<a onmouseover="document.images[01].src='bild_neu.gif'" onmouseout="document.images[01].src='bild_alt.gif'" href="datei.htm">Textlink</a>
ich kann mir nicht vorstellen, dass man Bilder so ansprechen kann, wennschon, dann dürften die Zahlen in der eckigen Klammer ohne führende Null sein.
Grüße aus Nürnberg
Tobias-
Danke, Tobias!
auch danke HarryS!danke erstmal für beide Lösungen, aber die von Tobias hat mir mehr zugesagt, auch wenn die Argumente von Harry nicht zuverachten sind :)
Das mit dem document.image funktiniert wirklich und ich glaube sogar die führende "null" muss sein ... probiers doch einfach mal selber aus mit dem was ich "oben" geschrieben habe :)
Bis dann ...
Danke!
MfG Thomas B
-
Hallo Thomas,
Danke, Tobias!
auch danke HarryS!tja, wir Nürnberger wissen halt wie sowas geht :-) *scnr*
danke erstmal für beide Lösungen, aber die von Tobias hat mir mehr zugesagt, auch wenn die Argumente von Harry nicht zuverachten sind :)
die Lösung werde ich mir trotzdem mal anschauen - vielleicht brauch ich sie mal :-)
Das mit dem document.image funktiniert wirklich und ich glaube sogar die führende "null" muss sein ... probiers doch einfach mal selber aus mit dem was ich "oben" geschrieben habe :)
unter [1] steht es ohne führende Null, ich habe es mal ausprobiert: es ist vollkommen egal, ob da eine Null steht oder nicht - es funktioniert auch wenn du 10 Nullen hinschreibst... :-)
Grüße aus Nürnberg
Tobias[1] http://selfhtml.teamone.de/javascript/objekte/images.htm#allgemeines
-
Hi Tobias,
also hatten wir ja beide Recht! :)
Übrigens, hab ich deine Lösung gleich umgesetzt und musste mit entsetzten (:P) feststellen, das die Hochkommatas nicht ganz korrekt waren ... außerdem muss man bei dieser Lösung die Hintergrundsbilder unbedingt per CSS eingebaut haben, und wenn es nur ein Tabellenfeld ist, was geändert werden soll, muss auch nur diesen Feld diese id bekommen:
<td style="background:url('images/bar_middle.gif')" width="204" align="left" id="sysinfo">
<a onmouseover="document.getElementById('sysinfo').style.backgroundImage = 'url(images/redbar_middle.gif)'"Trotzdem danke, ich hatte mir nämlich schon den halben Tag die Fingernägel abgekaut, weil ich nicht weiter wusste ... :)
MfG Thomas B
-
Hallo Thomas,
Übrigens, hab ich deine Lösung gleich umgesetzt und musste mit entsetzten (:P) feststellen, das die Hochkommatas nicht ganz korrekt waren ...
inwiefern? ich habe die halt einfach so verwendet, dass es funktioniert (dazu müssen es eben verschiedene sein)
außerdem muss man bei dieser Lösung die Hintergrundsbilder unbedingt per CSS eingebaut haben, und wenn es nur ein Tabellenfeld ist, was geändert werden soll, muss auch nur diesen Feld diese id bekommen:
mhh... ja, das könnte umständlich werden, aber vielleicht hilft getElementsByTagName()[1] weiter? allerdings dürfte dann das Durchzählen der <td>s etwas lästig sein... :-)
Trotzdem danke, ich hatte mir nämlich schon den halben Tag die Fingernägel abgekaut, weil ich nicht weiter wusste ... :)
tja, ein Blick auf [2] hätte vielleicht geholfen :-)
Grüße aus Nürnberg
Tobias[1] http://selfhtml.teamone.de/javascript/objekte/document.htm#get_elements_by_tag_name
[2] http://selfhtml.teamone.de/javascript/objekte/style.htm-
Hallo Tobias,
inwiefern? ich habe die halt einfach so verwendet, dass es funktioniert (dazu müssen es eben verschiedene sein)
Hab ich ein Posting weiter vorne geschrieben, aber warte:
Du hattest geschrieben:
onMouseOver='document.getElementById("bla").style.backgroundImage = "url(bild_neu.gif)"'
Heissen muss es:
<a onmouseover="document.getElementById('bla').style.backgroundImage = 'url(bild_neu.gif)'"Eigentlich müssen sie genau getauscht werden ...
mhh... ja, das könnte umständlich werden, aber vielleicht hilft getElementsByTagName()[1] weiter? allerdings dürfte dann das Durchzählen der <td>s etwas lästig sein... :-)
Ja, das ist es bestimmt :)
tja, ein Blick auf [2] hätte vielleicht geholfen :-)
Gegen das Fingernägelkauen?? :)
MfG Thomas B
-
Hallo Thomas,
onMouseOver='document.getElementById("bla").style.backgroundImage = "url(bild_neu.gif)"'
<a onmouseover="document.getElementById('bla').style.backgroundImage = 'url(bild_neu.gif)'"warum? Ich dachte das ist egal, welche Anführungszeichen man verwendet, oder funktioniert irgendwas nicht (bei mir funktionieren beide Versionen)? mal ganz davon abgesehen, war es vermutlich nicht soo schwer das umzudrehen... :-)
tja, ein Blick auf [2] hätte vielleicht geholfen :-)
Gegen das Fingernägelkauen?? :)nein, gegen den halben Tag... :-)
Grüße aus Nürnberg
Tobias-
Hallo Tobias,
warum? Ich dachte das ist egal, welche Anführungszeichen man verwendet, oder funktioniert irgendwas nicht (bei mir funktionieren beide Versionen)? mal ganz davon abgesehen, war es vermutlich nicht soo schwer das umzudrehen... :-)
Bei mir war das nicht egal ... der hat immer Scriptfehler gemeldet, bei mir funktioniert also nur die eine (meine) Version - aber wie du schon sagtest, das Umdrehen war nicht soo schwer :)
MfG Thomas B
-
Hallo Thomas,
Bei mir war das nicht egal ... der hat immer Scriptfehler gemeldet, bei mir funktioniert also nur die eine (meine) Version
in welchem Browser funktioniert, das bei dir nicht? bei mir funktioniert es mit beiden Versionen im Opera7b2, Mozilla1.2.1 und IE5.0 (alle w2k).
Grüße aus Nürnberg
Tobias-
Hallo Tobias,
in welchem Browser funktioniert, das bei dir nicht? bei mir funktioniert es mit beiden Versionen im Opera7b2, Mozilla1.2.1 und IE5.0 (alle w2k).
Ich hab nur den IE 6 getestet mit deiner Version, mit meiner lief mein Opera 6.04 und mein Netscape 7.0 ausgezeichnet
Grüße, Thomas B
-
-
-
-
-
-
-
-
-