  |
| Autor |
Nachricht |
SoA
Erfahrener [User]
Anmeldung: 29.04.04
Beiträge: 60
|
 Verfasst am: 20.08.2004, 22:53 Titel: hover effekte für <td> |
 |
|
hallo... kann mir einer von euch tipps geben wie ich am besteb hover effekte für <td>'s mache?
also zb hintergrundfarbe ändern border dicker machen usw usw... und wie kann ich ganze <td>'s verlinken? einfach tag frum machen?
cu
SoA
_________________
wer kämpft kann verlieren,
wer nicht kämpft hat schon verloren!
|
|
| Nach oben |
|
 |
JörgK
Beliebter [Mod]
Anmeldung: 09.04.04
Beiträge: 376
|
| Verfasst am: 20.08.2004, 23:25 Titel: |
|
|
du könntest den Link als Blockelement definieren (display:block), und dessen margin auf 0 setzen, dann nimmt es vollständigg den Platz der Tabellenzelle an - dann kannst du die betreffenden Hovereffekte für den Link definieren
Beispiel:
| Code: |
<html>
<head>
<style type="text/css">
<!--
a { display:block; margin:0; }
a:link { background-color:#cff; border:solid 1px #c99; padding:18px; }
a:visited { background-color:#ccf; border:solid 1px #c99; padding:18px; }
a:hover { background-color:#fcc; border:solid 3px #966; padding:16px; }
a:active { background-color:#fcf; border:solid 3px #966; padding:16px; }
a:focus { background-color:#ffc; border:solid 3px #966; padding:16px; }
-->
</style>
</head>
<body>
<table cellpadding="0" cellspacing="0">
<tr>
<td><a href="#">Text</a></td>
<td><a href="#">Text</a></td>
</tr>
<tr>
<td><a href="#">Text</a></td>
<td><a href="#">Text</a></td>
</tr>
</table>
</body>
</html>
|
_________________
 Webnotizen - Forum für XHTML, CSS und SEO - Bookmarks
|
|
| Nach oben |
|
|
SoA
Erfahrener [User]
Anmeldung: 29.04.04
Beiträge: 60
|
| Verfasst am: 20.08.2004, 23:31 Titel: |
|
|
danke... das klappt erstmal... muss ich zwar noch abändern aber ich denke damit komm ich klar,....
cu
SoA (:
EDIT:
ok... ich muss die frage mal wieder aufgreifen....
wenn ich nun davon ausgehe eine tabelle zu machen mit vielen zeilen und zb 3 spalten... wie mache ich es das sich beim mousover einer zelle die gesamte zeile nen hover effekt bekommt?
cu
SoA
_________________
wer kämpft kann verlieren,
wer nicht kämpft hat schon verloren!
|
|
| Nach oben |
|
|
sunbringer
Helfer [Mod]
Anmeldung: 19.09.04
Beiträge: 222
|
| Verfasst am: 04.11.2004, 23:12 Titel: |
|
|
Das ist schon schwerer und im Grunde nur mit Einsatz von layern zu schaffen, dann kannst du aber auch gleich die Tabelle weg lassen...
soweit ich weiß gibts bei DW die Möglichkeit "Ebene einfügen" ... für diese kannst du dann das "Verhalten" ändern. z.B. bei onmouseover auf einen layer mehreren layern gleichzeitig die eigenschaften zuzuweisen. tüftel da mal ein wenig rum...
Das ganze wird dann via JS-Funktionen geregelt ... ist dann allerdings schlecht, wenn ein besucher mal JS ausgeschaltet hat...
Wie gesagt, auf JS sollte man möglichst verzichten!
ev. könntest du auch mal eine url ansagen, wo man mal einen Blick drauf werfen könnte. wer weiß, vielleicht fällt uns dann ja noch was anderes ein 
ich könnte mir denken, das das auch mit anderen Scipts zu schaffen ist... müsste man dann mal sehen Nur durch CSS-Definitionen gehts allerdings nicht!
_________________
Sind wir Helden oder Roggenbrötchen?
Microcosm Media | Detektiv | Umwelt Atlas
|
|
| Nach oben |
|
|
JörgK
Beliebter [Mod]
Anmeldung: 09.04.04
Beiträge: 376
|
| Verfasst am: 04.11.2004, 23:36 Titel: |
|
|
Man kann in CSS zwar die hover-Eigenschaften auch einer Tabellenzeile zuordnen (tr:hover), dies funktioniert allerdings anscheinend nur bei der Eigenschaft background und nicht im Internet Explorer, von daher kein praktikable Ansatz.
_________________
Webnotizen - Forum für XHTML, CSS und SEO - Bookmarks
|
|
| Nach oben |
|
|
SoA
Erfahrener [User]
Anmeldung: 29.04.04
Beiträge: 60
|
| Verfasst am: 05.11.2004, 14:17 Titel: |
|
|
ja... das tr:hover hab ich ja versucht... geht aber nicht :/
hmmm dann wirds wohl keine brauchbare lösung für sowas geben 
naja... so isses numal
cu
SoA
_________________
wer kämpft kann verlieren,
wer nicht kämpft hat schon verloren!
|
|
| Nach oben |
|
|
maXman
Neuer [User]
Anmeldung: 17.02.05
Beiträge: 1
|
| Verfasst am: 17.02.2005, 21:01 Titel: |
|
|
| JörgK hat folgendes geschrieben: | | Man kann in CSS zwar die hover-Eigenschaften auch einer Tabellenzeile zuordnen (tr:hover), dies funktioniert allerdings anscheinend nur bei der Eigenschaft background und nicht im Internet Explorer, von daher kein praktikable Ansatz. |
stimmt - der IE mag den hover (außer bei links) eigentlich nicht. aber man kann das ganze nachbauen.
für die css-datei:
.saison tr:hover {background-color:#FFA07A;}
* html .saison tr {behavior: url(ie-hover.htc);}
und wir brauchen noch die datei
ie-hover.htc
die sieht so aus:
<public:component>
<public:attach event="onmouseout" handler="restore"/>
<public:attach event="onmouseover" handler="highlight"/>
<script language="JavaScript">
function highlight() {
element.runtimeStyle.background = '#FFA07A';
};
function restore() {
element.runtimeStyle.background = '';
};
</script>
</public:component>
_________________
maXman
|
|
| Nach oben |
|
|
coala
Neuer [User]
Anmeldung: 21.02.05
Beiträge: 9
|
| Verfasst am: 21.02.2005, 16:23 Titel: |
|
|
Das Thema ist ja wohl schon überholt, naja, egal...
Mit Javascript könnte das - hier am Beispiel der Hintergrundfarbe - so aussehen:::
| Code: |
<td onmouseover="this.style.backgroundColor='#ff0000';" onmouseout="this.style.backgroundColor='#000000';">
|
Gruss
coala
|
|
| Nach oben |
|
|
Lambert
Neuer [User]
Anmeldung: 17.04.05
Beiträge: 1
Wohnort: Amersfoort ...
|
| Verfasst am: 17.04.2005, 17:25 Titel: <tr> oder <td> |
|
|
Functioniert das auch für <tr> tags? Ich habe das schon programmiert, aber ich glaube das die <td> tags das effekt ändern...
Zum beispiel:
<tr onmouseover="this.style.backgroundColor='#000000';" onmouseout="this.style.backgroundColor='#990099';">
<td>cell1</td>
<td>cell2</td>
<td>cell3</td>
<td>cell4</td>
</tr>
Ich bekomme gerne mehr info hieruber.
|
|
| Nach oben |
|
|
|
|
