[GastForen Web allgemein HTML und CSS / Stylesheets Tabelle/Zellenfarbe bei Mouseover ändern

  • Suche
  • Hilfe
  • Lesezeichen
  • Benutzerliste
Themen
Beiträge
Moderatoren
Letzter Beitrag

Tabelle/Zellenfarbe bei Mouseover ändern

kultdialog
Beiträge gesamt: 36

30. Sep 2006, 09:50
Beitrag # 1 von 9
Bewertung:
(9351 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo liebe HDSler,

ich habe eine (für Euch wohl relativ simple) Frage bzgl. eine Navigationsleiste via CSS. Ich möchte unter zu Hilfenahme von CSS eine horizontale Naivleiste bauen und nicht nur die Textefarbe sondern auch die einzelnen Zellenfarben beim Mouseover ändern. Eine defninerte Zellenbreite möchte ich nicht haben, einfach nur die Farbenänderung.

Könnt Ihr mir da weiterhelfen? Alles was ich irgendwo finde, geht nur über Java oder sog. Event-Handler – aber das müsste doch recht einfach auch über CSS gehen oder?

Würde mich über Eure Hilfe freuen – vielen Dank.
Ich arbeite mit Dreamweaver MX.

Schönes Wochenende
Grüße Matthias
X

Tabelle/Zellenfarbe bei Mouseover ändern

ganesh
Beiträge gesamt: 1981

30. Sep 2006, 13:35
Beitrag # 2 von 9
Beitrag ID: #254018
Bewertung:
(9332 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
naja, definiere einfach eine Klasse für die TDs im CSS...

.htd hover,
.htd a:hover,
.htd a hover {
background: #c0c0c0;
display: block;
}

...

<tr><td class="htd"><a href="seite1.html">Zelle 1</a></td></tr>


als Antwort auf: [#253999]

Tabelle/Zellenfarbe bei Mouseover ändern

kultdialog
Beiträge gesamt: 36

1. Okt 2006, 14:24
Beitrag # 3 von 9
Beitrag ID: #254097
Bewertung:
(9319 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallöchen,

vielen Dank für die Hilfe. Ich weiß, ist sicherlich eine simple Sache, aber für jemanden wie mich ergibt das schon unüberwindbare Hindernisse :-(

Ok, das funktioniert auch. Jetzt habe ich nur noch ein Problem mit dem Text. Ich habe ein CSS mit versch. Textstilen definiert. Wenn ich die Zelle mit der TD-Class belege, so klappt das auch mit der HG-Farbe. Wenn ich dann allerdings den Text mit der CSS-Definition des Textstiles belege, ist die HG-Farbe wieder hinfällig. Dann habe ich versucht, in der TD-Class Definition direkt auch eine Textdefinition zu machen. Das sah dann ungefähr so aus:

.htd hover,

.htd a hover {
background: #c0c0c0;
display: block;
}

.htd a:hover {
background: #F45813;
display: block;
}

.headline {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
font-weight: bolder;
color: #FFFFFF;
text-transform: uppercase;
}

Aber das funktioniert auch nicht. Wie kann ich es schaffen, in einer Definition zu hinterlegen, dass sich bei Mouseober die HG-Farbe ändert und den Text zu defnieren???? Bin ich zu doof oder mache ich einen Denkfehler? Wie der Text aussehen sollte sieht man ja oben im CSS-Source.

Danke für Eure Hilfe
Grüße und einen schönen Sonntag

Matze


als Antwort auf: [#254018]

Tabelle/Zellenfarbe bei Mouseover ändern

FSt
  
Beiträge gesamt: 1965

1. Okt 2006, 14:43
Beitrag # 4 von 9
Beitrag ID: #254101
Bewertung:
(9317 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Matze

Wer bei HDS landet und sich hier Rat holt, der kann nicht zu doof sein ...

Code
.htd hover, .htd a hover { 
background: #c0c0c0;
display: block;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
font-weight: bolder;
color: #FFFFFF;
text-transform: uppercase;
}

htd a:hover {
background: #F45813;
display: block;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
font-weight: bolder;
color: #FFFFFF;
text-transform: uppercase;
}


Gruss
Martin


als Antwort auf: [#254097]

Tabelle/Zellenfarbe bei Mouseover ändern

kultdialog
Beiträge gesamt: 36

1. Okt 2006, 16:37
Beitrag # 5 von 9
Beitrag ID: #254114
Bewertung:
(9309 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Martin,

vielen Dank für Deine Hilfe. Aber ich weiß auch nicht . . .man fängt ja an zu zweifeln.

HG-Farbe ändert sich bei:
.htd hover,
.htd a hover {
background: #c0c0c0;
display: block;
} .htd a:hover { background: #F45813;
display: block;
}

Aber wie gesagt, Text bleibt Standardtext.

Dann habe ich Deinen Quelltext vob oben als CSS definiert. Leider funktioniert es nicht. Weder HG-Farbe noch Text (=Verdana).

Was mache ich falsch? Ich arbeite mit Dreamweaver MX und sichere die CSS als externes Dokument.css ab. Dann füge ich die CSS über "Import" in den <stlye>-bereich ein. Dann wähle ich die Zelle in der Tabelle "<td>" aus und wähle den ".htd"-Sheet aus. Mache ich da einen Fehler???

Sorry und vielen vielen Dank, Gruß
Matthias

PS: Ich kann die Seite im aktuellen Status auch mal online stellen.


als Antwort auf: [#254101]

Tabelle/Zellenfarbe bei Mouseover ändern

FSt
  
Beiträge gesamt: 1965

1. Okt 2006, 20:23
Beitrag # 6 von 9
Beitrag ID: #254134
Bewertung:
(9289 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Matthias

Mein Fehler. Da fehlt noch ein Punkt vor dem zweiten htd.
Code
.htd a { 
background: #c0c0c0;
display: block;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
font-weight: bolder;
color: #FFFFFF;
text-transform: uppercase;
}

.htd a:hover {
background: #F45813;
display: block;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
font-weight: bolder;
color: #FFFFFF;
text-transform: uppercase;
}


Gruss
Martin


als Antwort auf: [#254114]

Tabelle/Zellenfarbe bei Mouseover ändern

kultdialog
Beiträge gesamt: 36

1. Okt 2006, 22:33
Beitrag # 7 von 9
Beitrag ID: #254151
Bewertung:
(9277 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Nabend Martin :-)

vielen Dank, jetzt funktioniert das Ganze auch!! Danke :-) !!!!

Jetzt belästige ich Dich aber noch einmal. Die Änderung der HG-Farbe bezieht sich nur auf die Höhe der Schrift. Kann man diese .htd-Definition auch auf die ganze Zelle anwenden, so dass sich beim MouseOver die ganze Zellenfarbe ändert?

Aber wie gesagt, das Hauptsächliche funktioniert. Und dafür schon mal ganz großes Dankeschön.

Schönen Abend,
Gruß Matthias


als Antwort auf: [#254134]

Tabelle/Zellenfarbe bei Mouseover ändern

FSt
  
Beiträge gesamt: 1965

2. Okt 2006, 08:16
Beitrag # 8 von 9
Beitrag ID: #254173
Bewertung:
(9264 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Matthias

Bist Du sicher, dass Du "display: block;" eingebaut hast?
Mit welchem Browser testest Du?
Kannst Du mal Dein Code-Schnipsel online stellen?

Gruss
Martin


als Antwort auf: [#254151]

Tabelle/Zellenfarbe bei Mouseover ändern

kultdialog
Beiträge gesamt: 36

6. Okt 2006, 19:34
Beitrag # 9 von 9
Beitrag ID: #255120
Bewertung:
(9213 mal gelesen)
URL zum Beitrag
Beitrag als Lesezeichen
Hallo Martin,

ersteinmal entschuldigung für mein langes Nichtmelden. Aber ich war die Woche über nicht da und konnte nicht auf Deine Nachricht antworten. Sorry . . . :-) !!

Aber vielen Dank dass Du so geduldig bist mit mir. Ich hänge Dir zum einen mal den Codeschnipsel meines CSS (deines) an - Display:Block ist allerdings ausgewählt. Zusätzlich, ich denke das macht Sinn, habe ich Dir mal den Link vom momentan Stand der Seite angehängt. Hier kann man auch die Navigation sehen und dass nur immer der Bereich der Schrift seine HG-Farbe ändert.
(Link: http://www.dr-thilo-jahn.de/forum/index_011006.htm)

----------------------------------------------------------
.htd a {
background: #c0c0c0;
display: block;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
font-weight: bolder;
color: #FFFFFF;
text-transform: uppercase;
}

.htd a:hover {
background: #F45813;
display: block;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8px;
font-weight: bolder;
color: #FFFFFF;
text-transform: uppercase;
}
----------------------------------------------------

Kannst Dir das ja mal anschauen wenn Du Zeit hast.
Danke Dir auf jeden Fall schon einmal, gell!!

Grüße und ein schönes Wochenende.
Matthias


als Antwort auf: [#254173]
X