Anzeige von Tabellen steuern
NiX
- css
0 at0 NiX
0 Christoph Schnauß0 NiX
Hallo zusammen.
Ich möchte folgendes:
Wenn jemand beispielsweise mit der Maus über den Link
<a href="mailto:nix@dejanix.com">NiX</a>
fährt, soll unten die Tabelle
<table>
<tr>
<td>Das bin ich</td>
</tr>
</table>
erscheinen. Sonst nicht.
Wie mache ich das?
Habe was von a:hover, onmouseover und display: none gehört, aber ich brachte da nichts sinnvolles zusammen.
Grüsse,
NiX.
Hallo.
Habe was von a:hover, onmouseover und display: none gehört, aber ich brachte da nichts sinnvolles zusammen.
Was hast du denn zusammengebracht? Leg doch etwas zur Korrektur vor.
MfG, at
Hallo
Habe was von a:hover, onmouseover und display: none gehört, aber ich brachte da nichts sinnvolles zusammen.
Was hast du denn zusammengebracht? Leg doch etwas zur Korrektur vor.
Es hat nocht funktioniert, ich nam einfach so was:
css-code:
.test {
display: none;
}
html:
<a ...>onMouseOver="style=".test {display: block;}"">test</a>
<font class="test">testtabelle</font>
Ist wohl eher nicht so optimal.
Grüsse,
NiX.
hallo NiX,
Wenn jemand beispielsweise mit der Maus über den Link <a href="mailto:nix@dejanix.com">NiX</a> fährt, soll unten die Tabelle
<table>
<tr>
<td>Das bin ich</td>
</tr>
</table>
erscheinen.
Wie mache ich das?
Leider (noch) nicht ausschließlich mit CSS. Du brauchst einen (Javascript-)EventHandler dazu.
Habe was von a:hover, onmouseover und display: none gehört, aber ich brachte da nichts sinnvolles zusammen.
"a:hover" ist für diese Aufgabe relativ unwichtig, die beiden anderen jedoch nicht. "onmouseover" ist dabei der EventHandler, und "display" ist ein CSS-Element.
Vorgehen kannst du folgendermaßen:
zuerst bekommt deine Tabelle eine ID oder einen Namen und wird mit "display:none" unsichtbar gemacht.
<table id="tabelle" style="display:none">
<tr><td>Das bin ich</td></tr>
</table>
Dann sorgst du dafür, daß in deinem link der EventHandler aufgerufen wird und einfach "display:none" gegen "display:inline" oder etwas ähnliches austauscht. Das geht so:
<a href="mailto:nix@dejanix.com" onmouseover="document.getElementById('tabelle').style.display='inline'">NiX</a>
Das wars.
Wenn du ganz auf Javascript verzichten möchtest, gibt es doch einen Weg, mit "a:hover" zu experimentieren. Leider interpretiert aber der IE "hover" bisher ausschließlich bei links (<a>), sonst wärs eine prima Geschichte. Ein Beispiel, wie man das anstellen kann, findest du unter http://aktuell.de.selfhtml.org/tippstricks/css/infobox/index.htm
Grüße aus Berlin
Christoph S.
Hallo.
OK, vielen Dank für den Tipp!
Es ging jetzt perfekt ohne Javascript ;-)
Grüsse,
NiX.