Fragen zu Bootstrap Toggle

[NetAktiv]

Hallo,

der Code unten macht mit dem Bootstrap Framework weitgehend, was ich mir wünsche, nämlich einen Text auf- und wieder zuzuklappen. Allerdings hätte ich noch gerne, dass sich nach dem Aufklappen der der Hinweis-Text von [mehr] in [weniger] ändert oder dass dieser Hinweis-Text unsichtbar wird. Das sollte funktionieren, ohne dass ich zusätzliches JavaScript mit einem onClick-Event einbinde.

Hier etwas Text und nach dem Klick noch <a data-toggle="collapse" href="#details1">mehr</a>
<div id="details1" class="collapse">
   Hier ist mehr Text..</br>
   Hier ist mehr Text.. Klick für <a data-toggle="collapse" href="#details1">weniger</a>
</div>

 

[Marv]

Bootstrap setzt und entfernt automatisch eine .collapsed Klasse auf dein Toggle-Element. Das kannst du nutzen um den Text deines Toggle Elements zu steuern.

Hier etwas Text und nach dem Klick noch <a data-toggle="collapse" href="#details1">
  <span class="show-more">mehr</span>
  <span class="show-less">weniger</span>
</a>
<div id="details1" class="collapse">
   Hier ist mehr Text..
</div>

.show-more {
  display: none;
}

.collapsed .show-more {
  display: inline;
}

.collapsed .show-less {
  display: none;
}

 

[NetAktiv]

Hallo Marv,
danke, genau so wollte ich es haben.