Skip to main content Skip to secondary navigation Accessibility Feedback

Houdini Updates

Houdini, my simple collapse-and-expand widget, got an update last week.

You can now show different toggle text based on whether or not the content is active. Simply wrap your labels in <span> elements with the .collapse-text-show and .collapse-text-hide classes:

<a class="collapse-toggle" data-target="#show-me" href="#">
    <span class="collapse-text-show">Show +</span>
    <span class="collapse-text-hide">Hide -</span>
</a>

<div class="collapse" id="show-me">
    <p>Now you see me, now you don't.</p>
</div>
  • More articles on...
  • Code

Have any questions or comments about this post? Email me at chris@gomakethings.com or contact me on Twitter at @ChrisFerdinandi.

Get Weekly Digests