a:hover soll div-Eigenschaften ändern

[Daniel Vogel]

Hallo alle zusammen!

Ich habe ein Problem bei folgendem Versuch:
Ich habe ein <div class="show"> welches im CSS mit z-index: -1 in den Hintergrund gesetzt wurde. Ausserdem habe ich einen <a href="index.html" target="_self" class="showIt">Hover me!</a> auf der Site. Ich moechte jetzt, dass, wenn man auf den a.showIt hovert (a.showIt:hover), der z-index-Wert vom div.show auf 2 gesetzt wird, also praktisch den Wert eines Divs unter seinen Fuessen weg aendern...
Ist dies moeglich, wenn ja, wie?

Mit freundlichen Gruessen

Daniel Vogel
aka. BluMelon

[Cheatah]

Hi,

Ist dies moeglich, wenn ja, wie?

nein. Das <div>-Element müsste sich innerhalb des Links befinden, was HTML-invalide ist.

Cheatah

[Rouven]

Hello,

nein. Das <div>-Element müsste sich innerhalb des Links befinden, was HTML-invalide ist.

da weist du mich auf was interessantes hin - mir fällt nämlich gerade auf, dass ich an einer Stelle so ein ähnliches Konstrukt verbaut habe, in meinem Fall wollte ich ein <table>-Element innerhalb des Links unterbringen.
Nun ist es ja so, dass ich mittels CSS die Display-Eigenschaft von table auf inline setzen kann, damit wäre die Tabelle doch gültiger Inhalt, oder nicht? Der Validator erkennt das allerdings nicht an, weil die Standardeigenschaft des Tables eben nicht inline ist.
Gibt's irgendeine Variante, die auch ein Internet Explorer versteht (also ohne display: table-cell etc.), eine Tabelle(ndarstellung) in einem Link unter zu bringen und trotzdem xhtml strict zu sein? Warum brauch ich das? Genau wegen eines solchen Hover-Effekts...

MfG
Rouven

[wahsaga]

hi,

da weist du mich auf was interessantes hin - mir fällt nämlich gerade auf, dass ich an einer Stelle so ein ähnliches Konstrukt verbaut habe, in meinem Fall wollte ich ein <table>-Element innerhalb des Links unterbringen.
Nun ist es ja so, dass ich mittels CSS die Display-Eigenschaft von table auf inline setzen kann, damit wäre die Tabelle doch gültiger Inhalt, oder nicht?

Nicht.

Der Validator erkennt das allerdings nicht an, weil die Standardeigenschaft des Tables eben nicht inline ist.

Und du merkst nicht, dass du hier HTML mit CSS durcheinanderbringst. Letzteres beeinflusst die Darstellung - aber nicht die in HTML definierten Merkmale eines Elements.

Gibt's irgendeine Variante, die auch ein Internet Explorer versteht (also ohne display: table-cell etc.), eine Tabelle(ndarstellung) in einem Link unter zu bringen und trotzdem xhtml strict zu sein? Warum brauch ich das? Genau wegen eines solchen Hover-Effekts...

Eine Lösung könnte man vielleicht finden, wenn du das Problem beschreibst - anstatt den angeblichen Grund, solch ein Konstrukt zu "brauchen".

gruß,
wahsaga

[Rouven]

Hello,

Eine Lösung könnte man vielleicht finden, wenn du das Problem beschreibst - anstatt den angeblichen Grund, solch ein Konstrukt zu "brauchen".

Es geht um eine Bildergalerie. Dargestellt wird das Bild (Thumb) und ein Titel. Das ganze ist anklickbar und führt zu einer Detaildarstellung. Überfährt man mit der Maus das Bild bzw. den Titel, dann soll unterhalb des Bildes ein Bereich mit zusätzlichen Informationen wie Bildmaße, Aufnahmeort, Dateigröße, Beschreibung etc. sichtbar werden; Die Lösung mit dem :hover des Links gefiel mir sehr gut, da sie den Verzicht auf JavaScript ermöglicht, aber offenkundig macht mir HTML einen Strich durch die Rechnung.
Wie gesagt, ich suche für die Zusatzinformationen eine tabellarische Darstellung, aber meines Wissens sträubt sich der Internet Explorer gegen CSS-Anweisungen bzgl. der display-Eigenschaften in Richtung table, sonst wäre ich vielleicht auf sowas ausgewichen.

MfG
Rouven

[MudGuard]

Hi,

Ist dies moeglich, wenn ja, wie?

Ja, s.u.

nein.

falsch.

Das <div>-Element müsste sich innerhalb des Links befinden,

Nein.

  
<a href="whatever.html">hier drauf mit der Maus!</a>  
<div>Whatever</div>  

~~~~~~css
  
a + div { display:none; }  
a:hover + div { display:block; }  

(dafür, daß der IE < 7 dabei kläglich versagt, ist das Linkziel vorhanden ...)

cu,
Andreas

[Gunnar Bittersmann]

Hello out there!

Ich habe ein <div class="show">

Warum dann nicht <div id="show">?

Ausserdem habe ich einen <a href="index.html" target="_self" class="showIt">Hover me!</a>

Dito. Und wozu das 'target'-Attribut?

Ich moechte jetzt, dass, wenn man auf den a.showIt hovert (a.showIt:hover), der z-index-Wert vom div.show auf 2 gesetzt wird […]
Ist dies moeglich,

Nicht mit CSS.

wenn ja, wie?

Mit JavaScript. getElementById() und style sind deine Freunde.

See ya up the road,
Gunnar

[Der Martin]

Hallo Gunnar,

Ich habe ein <div class="show">
Warum dann nicht <div id="show">?
Ausserdem habe ich einen <a href="index.html" target="_self" ...
Dito.

in der deutschen Sprache wird "ein" selten mit der Bedeutung "genau ein" verwendet. Und wenn, dann wird die Aussage "genau ein" üblicherweise noch durch andere Stilmittel hervorgehoben. ;-)

Schönen Abend noch,
 Martin

[David Aurelio]

Ich moechte jetzt, dass, wenn man auf den a.showIt hovert (a.showIt:hover), der z-index-Wert vom div.show auf 2 gesetzt wird […]
Ist dies moeglich,

Nicht mit CSS.

Das stimmt nicht unter allen Umständen; in Browsern™ könnte man das so lösen:

  
<a href="tolleseite">Hier geht's zur tollen Seite!</a>  
<div>tolle Infos zur tollen Seite</div>  

dazugehöriges CSS:

  
a:hover + div {  
z-index: 2  
/* usw. */  
}  

In der Praxis lässt sich das natürlich dank des technologischen Spitzenreiters nicht einsetzen...