TD nur bei mousover sichtbar machen

[martinhahn90]

Servus Jungs,

würde gerne eine TD unsichtbar- und nur bei einem mousover sichtbar machen.
Ich habe es bereits mit visibility und display versucht, allerdings klappen beide Varianten nur umgekhert, heißt: Ich kann es bei einem mouseover verschwinden lassen.

Klingt für mich soweit auch logisch: Was nicht da ist, kann auch keinen Hover haben.

Wisst ihr eine Lösung dafür?


Edit:
Oh man, selber drauf gekommen, als ich meine eigene Seite angesurft habe. Hatte damals schon mit opacity gearbeitet, um einen DIV-Layer einzubauen.
Habe nun einfach die Anfangsopacity auf 0 gesetzt, die zum Ende hin auf 99. Das war ja denkbar einfach.

 

[cebito]

AW: TD nur bei mousover sichtbar machen

mach mal ein Bild - sichtbar/unsichtbar - um besser zu verstehn wo "gehovert" werden soll

Edit: na dann, hat sich 's ja erledigt......

 

[martinhahn90]

AW: TD nur bei mousover sichtbar machen

KLappt soweit wunderbar, meine Lösung:

(hier links unter dem Logo)

Nun kommt das große aber, das ich bestimmt mit reinem HTML/CSS nicht lösen kann (oder?):
Ich hätte gerne, dass das ganze erst fünf bis sechs Sekunden später verschwindet und zwar auf leichte Art und Weise.
Leicht, spricht sanft, soll es auch herein"fliegen". Also quasi erst mit 25% Opacity, dann 50, dann 75, dann 100. Sonst wirkt es schon extram hart.

Weiß dafür jemand eine Lösung? =)

 

[waterwebdesign]

AW: TD nur bei mousover sichtbar machen

Wenn du in deine Tabellenzelle noch einen Abastz legst, kannst du den mittels CSS ein-/ausblenden. Zelle und Absatz (oder Div, span, je nach Inhalt) müssen die gleiche Größe zugewiesen bekommen. Wenn dann die Zelle überfahren wird (hover) springt display:inline; für den Absatz ein (oder display:block; je nach Verwendungszweck). Damit dürfte dir also geholfen sein:

p {display:none;}
td,p {width:250px; height:250px;}
td:hover p{display: inline;}
...
<td><p>Text oder Bilder etc.</p>

Bei Bildern als Inhalt empfiehlt sich natürlich ein Div.

Edit: das ist natürlich nur hartes ein-ausblenden. Deine andere Frage ist mit JavaScript zu lösen (damit hast du das Blenden doch auch schon gemacht). In deine hide() musst du am Anfang doch dann nur schreiben, dass der Inhalt noch 6 Sekunden zu sehen ist.

 

[leohh]

AW: TD nur bei mousover sichtbar machen

p {display:none;}
td,p {width:250px; height:250px;}
td:hover p{display: inline;}
...
<td><p>Text oder Bilder etc.</p>

Wird Browseruebergreifend nur ueber einen Anchor funktionieren...
Schoenen Gruss nach Redmond