Truncator documentation

Truncator automatically limits the amount of text in an element, adding links to show and hide the full text.

Example

This is the really, really long text to truncate. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus turpis erat, pulvinar eget, gravida in, lacinia quis, est. Mauris libero risus, dignissim sed, venenatis ornare, fringilla eget, tellus. Donec eget est. Sed euismod. Nullam pretium ultricies est. Maecenas ultrices commodo tortor. Fusce sodales convallis tortor. Aliquam malesuada lobortis enim. Pellentesque dui est, consequat venenatis, egestas nec, varius id, felis. Curabitur egestas mi. Vivamus viverra augue hendrerit ligula. Curabitur pellentesque molestie nibh. In leo. Cras feugiat. Nulla facilisi. Phasellus aliquam arcu quis massa. Vivamus a velit. Aenean tincidunt, ante at congue ornare, orci est sodales purus, sit amet dictum purus lorem in lectus. Nulla vehicula erat non orci. Donec tristique. Vestibulum est augue, suscipit ut, pulvinar sed, pretium consectetur, eros. Cras non magna. Vivamus consectetur posuere sapien. Quisque diam mi, luctus vel, viverra vel, scelerisque eu, nisl.

<p class="truncator">This is the really, really long text to truncate. Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus turpis erat, pulvinar eget, gravida in, lacinia quis, est. Mauris libero risus, dignissim sed, venenatis ornare, fringilla eget, tellus. Donec eget est. Sed euismod. Nullam pretium ultricies est. Maecenas ultrices commodo tortor. Fusce sodales convallis tortor. Aliquam malesuada lobortis enim. Pellentesque dui est, consequat venenatis, egestas nec, varius id, felis. Curabitur egestas mi. Vivamus viverra augue hendrerit ligula. Curabitur pellentesque molestie nibh. In leo. Cras feugiat. Nulla facilisi. Phasellus aliquam arcu quis massa. Vivamus a velit. Aenean tincidunt, ante at congue ornare, orci est sodales purus, sit amet dictum purus lorem in lectus. Nulla vehicula erat non orci. Donec tristique. Vestibulum est augue, suscipit ut, pulvinar sed, pretium consectetur, eros. Cras non magna. Vivamus consectetur posuere sapien. Quisque diam mi, luctus vel, viverra vel, scelerisque eu, nisl.</p>

Settings

Valid elements

Any element

Classname

truncator

Attributes

None

CSS parameters (what’s this?)

None