moin,
Frage
Ist es möglich, dass man mit einer Kombination aus Geschwisterselektor ~ (oder Next-Sibling Combinator?) und anderen Pseudo-Selektoren (und/oder) (weitere/andere) Selektoren nur die nächsten Elemente bis zu einem bestimmten Marker-Element selektiert werden, und alle weiteren Elemente die nur mit ~ selektiert werden würden nicht? Sprich: nicht alle im Parent-Element?
Schema meiner Vorstellung
Schema der mehrfachen Selektierung der Elemente bis zu einem bestimmten Marker-Element, in diesem Fall: vom start bis ende:
text start comment … comment end text start comment … comment end text start comment … comment end text
Was ich gemacht habe
Ich habe den "Comment-Start-Delimiter" (%%) als "Collapse-Indicator" verwendet.
Die "Comment-End-Delimiter" (%%) und die "Comments" sind mit display: none; im Normal-Zustand ausgeblendet. Wenn man auf einer der "Comment-Start-Delimiter" klickt und gedrückt hält, werden mit Hilfe von display: inline; die
"Comments" und "Comment-End-Delimiter" mit Hilfe von display: inline-block; angezeigt.
Ausschnitt:
<div class="line">
text
<span class="start">%%</span>
<span class="comment">Lorem ipsum</span>
<span class="end">%%</span>
text
<span class="start">%%</span>
<span class="comment">[</span>
<span class="comment">dolor</span>
<span class="comment">]</span>
<span class="comment">(</span>
<span class="comment">sit</span>
<span class="comment">)</span>
<span class="start">%%</span>
text
</div>
<div class="line">
text
<span class="start">%%</span>
<span class="comment">consetetur sadipscing elitr</span>
<span class="end">%%</span>
text
<div>
Resultat:
- ausgeblendet:
text%%text%%text
text%%text - "Collapse-Indicator" von "Lorem ipsum"-Kommentar geglickt:
text%%Lorem ipsum%%text%%[dolor](sit)%%text
text%%text - "Collapse-Indicator" von "[dolor](sit)"-Kommentar geglickt:
text%%text%%[dolor](sit)%%text
text%%text - "Collapse-Indicator" von "consetetur sadipscing elitr"-Kommentar geglickt:
text%%text%%text
text%%consetetur sadipscing elitr%%text
Meine Untersuchungen
Durch das gedrückt klicken auf einen "Collapse-Indicator", werden alle "Comments", die nach dem geklickten Elemnt stehen, mit ihrem "Comment-End-Delimiter" im jeweiligen Parent-Element angezeigt.
Zu meiner näheren Untersuchung
Der "Comments"-Abschnitt beträgt n-Längen. D.h. ich kann nicht drauf hoffen, dass es nur ein einziges "Comments"-Element gibt in Form von .start + .comment + .end. Das habe ich hier ja schon im [dolor](sit)-Kommentar gezeigt. Hier wäre es .start + .comment + .comment + .comment+ .comment + .comment + .comment + .end.
Mein Verständnis des Problems
Wenn ich auf den "Collapse-Indicator" von Lorem ipsum-Kommentar gedrückt klicke, blenden sich alle diejenigen ein, die im ersten Parent-Element line sind also Lorem ipsum-Kommentar und [dolor](sit)-Kommentar. lorem ipsum-Kommentar nicht da er ja in einem anderen Parent-Element liegt. Wenn ich auf den "Collapse-Indicator" von [dolor](sit)-Kommentar gedrückt klicke, wird nur dieser Kommentar angezeigt da er der letzte Kommentar im Parent-Element ist und ~ selektiert nicht rückwärts.
Mein Fazit
Leider ist mir kein CSS Selektor-Kombination bekannt, die das bewerkstelligen kann.
Guten Abend,
lgmb
P.S.: Ich hoffe meine Metasyntaktischen Variablen sind zur besseren Kommunikation geeignet, da ich zu unkreativ bin, mir ein einfaches und konkretes Beispiel auszudenken. Und mit Obsidian-App-Szenarien, will ich euch nicht belästigen, den das würde - denke ich - eher zu noch mehr Fragen euerseits führen.
Sprachstörung