:target und ":defaulttarget"
dave
- css
0 Gunnar Bittersmann0 dave0 Matthias Apsel1 michaa
0 dave
0 Gunnar Bittersmann
Hi,
ich hab eine kleine Seite auf der verschiedene Layer in Abhängigkeit vom location-hash angezeigt werden:
<!DOCTYPE html>
<html>
<head>
<title></title>
<style type="text/css">
[code lang=css] .layer {display:none;}
.layer:target {display:block;}
</style>
</head>
<body>
<a href="#foo">to foo</a>
<a href="#bar">to bar</a>
<div id="foo" class="layer">foo</div>
<div id="bar" class="layer">bar</div>
</body>
</html>[/code]
Nun möchte ich aber eins davon angezeigt haben wenn _kein_ hash angegeben ist, als default sozusagen.
Das wird nicht möglich sein oder?
~dave
@@dave:
nuqneH
<div id="foo" class="layer">foo</div>
<div id="bar" class="layer">bar</div>
Da ist wohl 'section' angebracht; @class kannst du dir dann evtl. sparen:
<section id="foo">foo</section>
<section id="bar">bar</section>
Nun möchte ich aber eins davon angezeigt haben wenn _kein_ hash angegeben ist, als default sozusagen.
Welches? Das erste? Das letzte? Ein beliebiges?
Das wird nicht möglich sein oder?
Kommt drauf an.
Wenn das letze:
section:target, section:last-of-type { display: block }
section:not(:target), section:target~section:last-of-type { display: none }
Qapla'
Hi
<div id="foo" class="layer">foo</div>
<div id="bar" class="layer">bar</div>Da ist wohl 'section' angebracht; @class kannst du dir dann evtl. sparen:
Stimmt.
Welches? Das erste? Das letzte? Ein beliebiges?
Das ist mir zum Glück egal, hauptsache irgendeins.
Wenn das letze:
section:target, section:last-of-type { display: block }
section:not(:target), section:target~section:last-of-type { display: none }
Den ~-Selektor vergessen ich nur zu gerne.
Ich weis nicht mal wie man den nennt xD
Vielen Dank.
~dave
Om nah hoo pez nyeetz, dave!
Den ~-Selektor vergessen ich nur zu gerne.
...
~dave
??? ;p
Es ist kein Selektor sondern ein Kombinator. Er heißt General sibling combinator. Im Wiki in Ermangelung einer besseren Übersetzung Schwesternselektor. Er steht dort zwar unter der Überschrift Kombinatoren, aber ...
Matthias
...Im Wiki in Ermangelung einer besseren Übersetzung Schwesternselektor.
Naja, Geschwisterselektor würde vielleicht klarer machen, worum es geht, eben nicht unbedingt um 'ne Schwester ...
Moin,
...Im Wiki in Ermangelung einer besseren Übersetzung Schwesternselektor.
Naja, Geschwisterselektor würde vielleicht klarer machen, worum es geht, eben nicht unbedingt um 'ne Schwester ...
zumal der Begriff "Geschwister" die direkte und übliche Übersetzung des englischen Ausdrucks "sibling" wäre.
Ciao,
Martin
Om nah hoo pez nyeetz, Der Martin!
zumal der Begriff "Geschwister" die direkte und übliche Übersetzung des englischen Ausdrucks "sibling" wäre.
http://forum.de.selfhtml.org/archiv/2010/12/t202276/#m1366008 ff
Matthias
Hi,
mit dem general sibling combinator habe ich leider im IE Probleme (an dieser Stelle möchte ich mich für das Doppelposting entschuldigen).
Hat jemand noch eine andere Idee?
~dave
@@Gunnar Bittersmann:
nuqneH
section:target, section:last-of-type { display: block }
section:not(:target), section:target~section:last-of-type { display: none }
So natürlich nicht!
Ich wollte erst schreiben
~~~css
section:target, section:last-of-type { display: block }
section, section:target~section:last-of-type { display: none }
was in modernen Browsern auch funktioniert.
Ich hatte befürchtet, dass dies in älteren Browsern, die :target nicht kennen, gar kein 'section'-Element anzeigt. Vermutlich grundlos, denn die ignorieren dann wohl die gesamte Regel.
Qapla'