JavaScript - Tabellenhintergrundfarbe ändern

01.11.2005, 09:12

Hallo,

mir fehlt ein Befehl und ich hoffe, ihr könnt mir weiterhelfen:

Ich habe meine Navigationsbereich mit Tabellen aufgebaut. Nun soll sich, sobald der MouseZeiger über ein Tabellenfeld und somit Link fährt die Farbe dieses Feldes ändern.

Ich hab es schonmal soweit geschafft, dass sich hiermit:

Code:

<script language = "Javascript">
		function pageBackground(bkgColor) {
		document.bgColor=bkgColor
		}
		</script>

Code:

<tr><td align="center" height="25">Kontakt</td>

schonmal die Hintergrundfarbe für die ganze Seite ändert. Aber mit welchem Befehl kann ich das jetzt nu auf die Farbe des Feldes beziehen??

Daaanke schonmal für eure Hilfe!

01.11.2005, 10:57

Code:

<table>
  <tr>
    <td onMouseOver="this.bgColor = '#FFFF00'" onMouseOut="this.bgColor = document.bgColor">Ich bin ein Link!</td>
  </tr>
</table>

01.11.2005, 12:48

Code:

#link:hover{ background-color: green; }

Code:

<table>
  <tr>
    <td id="link">Ich bin ein Link!</td>
  </tr>
</table>

01.11.2005, 12:55

Kleine Feinheit am Rande: Da wahrscheinlich häufiger Links im Dokument vorkommen, sollte nicht mit einer ID sondern mit einer Klasse gearbeitet werden, da IDs einmalig vergeben werden, also

Code:

.link:hover {
    background-color:green;
}

<table>
  <tr>
    <td class="link">Ich bin ein Link!</td>
  </tr>
</table>

01.11.2005, 13:50

Die Lösung von Karl war die, die ich gesucht habe .. hoffentlich bekomm ich das jetzt auch noch richtig mit den Farben hin.

Daaanke!!

01.11.2005, 13:51

... ich hab es hinbekommen. Ist ja gar nicht soo schwer.

Kann man diesen Befehl mit Mouseover auch in CSS schreiben?!?!

01.11.2005, 13:55

Und jetzt habe ich gleich noch ein Problem:

Im IE geht das alles gut und schön. Aber beim Firefox nicht. Da geht der Link nicht..

Code:

<tr><a href="impressum.html">
       					<td class="link" onMouseOver="this.bgColor = '#E8B9AF'" onMouseOut="this.bgColor = '#CC8676'">Impressum</td></a>
       	</tr>

Habt ihr nen Rat, was hier falsch ist?!

01.11.2005, 14:19

Zitat:

Zitat von Gertrud

Habt ihr nen Rat, was hier falsch ist?!

Der FF hat es ganz gerne, wenn man eine Tabelle mit einem <table>-Tag beginnt. Auch sollte das <a> innehalb der <td>-Tags stehen.

Code:

<table>
  <tr>
    <td class="link" onMouseOver="this.bgColor = '#E8B9AF'" onMouseOut="this.bgColor = '#CC8676'">Impressum</td>
  </tr>
</table>

Zitat:

Zitat von Gertrud

Kann man diesen Befehl mit Mouseover auch in CSS schreiben?!?!

Wie man das in CSS realisieren kann, wurde Dir ja schon genannt!

Das ist sicherlich auch die bessere Lösung!

01.11.2005, 14:26

Ich will ja eben das <a> nicht im <td> haben - denn der ganze <td> soll mein Link sein.

01.11.2005, 14:29

Übrigens geht das mit dem CSS auch nicht so ..

Ich habe jetzt im CSS die 2 Einträge:

Code:

.link
	{ height: 25;
	  text-align: center;}

.link:hover
	{ background-color: '#E8B9AF';
	  height: 25;
	  text-align: center;}

Und im HTML das so:

Code:

	<tr><td class="link">Passwort ändern</td>
				       	</tr>

Und das hover geht nicht.

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
JS: Einführung - Javascript im Schichtenmodell	nikosch	Tutorials	4	11.04.2009 17:06
Lange Verarbeitungszeiten - Zuviel JavaScript?	[-UFO-]Melkor	HTML, Usability und Barrierefreiheit	2	15.06.2007 23:54
http user mit Javascript abfrage	tennessee	HTML, Usability und Barrierefreiheit	3	31.10.2006 13:18
Unsichtbares Formularfeld mit Javascript ansprechen	mAy^daY	HTML, Usability und Barrierefreiheit	6	13.08.2006 21:25
Javascript von Smileys und Buttons wie B U I ändern...	mickschen	HTML, Usability und Barrierefreiheit	10	07.06.2006 15:56
PHP + Javascript + MYSQL	socke	PHP Tipps 2006	4	02.04.2006 22:02
Variable wird geändert bei Übergabe an Javascript		PHP Tipps 2007	4	17.12.2005 16:53
[Erledigt] Mit PHP prüfen ob JavaScript beim Browser aktiviert ist?		HTML, Usability und Barrierefreiheit	3	21.07.2005 12:43
[Erledigt] Mouseover Menü in Javascript und PHP Lösung ?		PHP Tipps 2005-2	4	20.07.2005 08:48
JavaScript & PHP (Bilderupload)		PHP-Fortgeschrittene	5	11.07.2005 17:08
Php soll Javascript beschleunigen		PHP Tipps 2005	4	17.04.2005 12:56
Javascript ON/OFF	Connar	PHP Tipps 2005	3	03.04.2005 09:47
JavaScript in JavaScript geschriebene Html-Datei einbinden.	woods	HTML, Usability und Barrierefreiheit	6	06.09.2004 18:33
Javascript		HTML, Usability und Barrierefreiheit	5	31.08.2004 18:30
php + Javascript, Variablenübergabe		PHP Tipps 2004	14	28.07.2004 15:42

01.11.2005, 09:12
Gast Beiträge: n/a	JavaScript - Tabellenhintergrundfarbe ändern Hallo, mir fehlt ein Befehl und ich hoffe, ihr könnt mir weiterhelfen: Ich habe meine Navigationsbereich mit Tabellen aufgebaut. Nun soll sich, sobald der MouseZeiger über ein Tabellenfeld und somit Link fährt die Farbe dieses Feldes ändern. Ich hab es schonmal soweit geschafft, dass sich hiermit: Code: <script language = "Javascript"> function pageBackground(bkgColor) { document.bgColor=bkgColor } </script> Code: <tr><td align="center" height="25">Kontakt</td> schonmal die Hintergrundfarbe für die ganze Seite ändert. Aber mit welchem Befehl kann ich das jetzt nu auf die Farbe des Feldes beziehen?? Daaanke schonmal für eure Hilfe!


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

01.11.2005, 10:57
Gast Beiträge: n/a	Code: <table> <tr> <td onMouseOver="this.bgColor = '#FFFF00'" onMouseOut="this.bgColor = document.bgColor">Ich bin ein Link!</td> </tr> </table>

01.11.2005, 12:48
Gast Beiträge: n/a	Code: #link:hover{ background-color: green; } Code: <table> <tr> <td id="link">Ich bin ein Link!</td> </tr> </table>

01.11.2005, 12:55
Gast Beiträge: n/a	Kleine Feinheit am Rande: Da wahrscheinlich häufiger Links im Dokument vorkommen, sollte nicht mit einer ID sondern mit einer Klasse gearbeitet werden, da IDs einmalig vergeben werden, also Code: .link:hover { background-color:green; } <table> <tr> <td class="link">Ich bin ein Link!</td> </tr> </table>

01.11.2005, 13:50
Gast Beiträge: n/a	Die Lösung von Karl war die, die ich gesucht habe .. hoffentlich bekomm ich das jetzt auch noch richtig mit den Farben hin. Daaanke!!

01.11.2005, 13:51
Gast Beiträge: n/a	... ich hab es hinbekommen. Ist ja gar nicht soo schwer. Kann man diesen Befehl mit Mouseover auch in CSS schreiben?!?!

01.11.2005, 13:55
Gast Beiträge: n/a	Und jetzt habe ich gleich noch ein Problem: Im IE geht das alles gut und schön. Aber beim Firefox nicht. Da geht der Link nicht.. Code: <tr><a href="impressum.html"> <td class="link" onMouseOver="this.bgColor = '#E8B9AF'" onMouseOut="this.bgColor = '#CC8676'">Impressum</td></a> </tr> Habt ihr nen Rat, was hier falsch ist?!

01.11.2005, 14:26
Gast Beiträge: n/a	Ich will ja eben das <a> nicht im <td> haben - denn der ganze <td> soll mein Link sein.

01.11.2005, 14:29
Gast Beiträge: n/a	Übrigens geht das mit dem CSS auch nicht so .. Ich habe jetzt im CSS die 2 Einträge: Code: .link { height: 25; text-align: center;} .link:hover { background-color: '#E8B9AF'; height: 25; text-align: center;} Und im HTML das so: Code: <tr><td class="link">Passwort ändern</td> </tr> Und das hover geht nicht.