Jquery折叠并展开bootstrap插件

Question

I been using bootstrap collapse in my site.

is there any jquery that i can use in my bootstrap site that will work like this.

example

i have a comment section. sample comment would be like this.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sit amet suscipit magna. Sed nisl ipsum, tempus quis tincidunt non, molestie eget tortor. Sed scelerisque magna arcu, non hendrerit lorem vehicula ut. Vestibulum vulputate erat non mauris vulputate condimentum. Nam adipiscing nec risus at condimentum. Nulla sed lorem lacus. Proin bibendum, diam non faucibus fringilla, diam leo scelerisque nisl, sed tempor velit diam eu turpis. Aenean lacinia auctor tellus non tincidunt. Vivamus condimentum sem lacus. Donec vehicula eros erat, eu scelerisque urna varius eu. Phasellus lobortis dignissim dolor euismod pharetra. Morbi sodales posuere nisi sodales adipiscing. Vestibulum nec tortor vitae diam pharetra pretium sed eget arcu. Vestibulum ultricies rutrum risus. Cras rhoncus magna eget viverra dignissim. Integer et justo lacus.

i want to make it something like this..that on every 5th of the line it will be change it to see more like the one on facebook.

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus sit amet suscipit magna. Sed nisl ipsum, tempus quis tincidunt non, molestie eget tortor. Sed scelerisque magna arcu, non hendrerit lorem vehicula ut. Vestibulum vulputate erat non mauris vulputate condimentum. Nam adipiscing nec risus at condimentum. Nulla sed lorem

See more...

i tried using collapse in bootstrap collapse but it collapse all part of the message.

Answer 1

You can use the jTruncate jQuery plugin.

In a nutshell, jTruncate provides simple yet customizable truncation for text entities in your web page.

Code:

$().ready(function () {
    $('p').jTruncate({
        moreText: "See more..."
    });
});

Demo: http://jsfiddle.net/IrvinDominin/wFTLj/