3

I am using the jQuery dotdotdot truncation plugin dotdotdot.frebsite.nl

I want to truncate at max 2 lines. And when a user clicks on more, then it must show the full text (expand/de-truncate).

So far, I "only" manage to truncate my text. But not to "de-truncate" it.

Here is my code:

<p class="truncate">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Ut vitae tellus eu dui placerat interdum. Lorem ipsum dolor sit amet, consectetur adipiscing elit.<a class="read-more" href="#">more</a></p>

$(document).ready(function(){

    $('.truncate').dotdotdot({
        ellipsis     : '… ',
        watch        : true,
        wrap         : 'letter',
        height       : parseInt( $('.truncate').css('line-height'), 10) * 2, // this is the number of lines
        lastCharacter: {
            remove: [ ' ', ',', ';', '.', '!', '?' ],
            noEllipsis: []
        },
        after: "a.read-more"
    });


});

Live demo jsfiddle.net/NSnxe/1

kenorb
  • 155,785
  • 88
  • 678
  • 743
cusejuice
  • 10,285
  • 26
  • 90
  • 145
  • What is your question? – Barbara Laird Sep 25 '13 at 22:07
  • When a user clicks "more," I want the full text to expand and 'de-truncate'. – cusejuice Sep 25 '13 at 22:09
  • Note that the values you have for `lastCharacter` option are the same as the default ones. Hence this part of the code is irrelevant. – Adriano Mar 17 '15 at 14:40
  • possible duplicate of [Read More and Read Less with dotdotdot jQuery](http://stackoverflow.com/questions/25187774/read-more-and-read-less-with-dotdotdot-jquery) – Adriano Mar 18 '15 at 09:56
  • I added a complete answer to the same question on http://stackoverflow.com/questions/25187774/read-more-and-read-less-with-dotdotdot-jquery/29118739#29118739 – Adriano Mar 18 '15 at 09:57

1 Answers1

6

You can send a destroy message to dotdotdot

$('a.read-more').on( 'click', function(event) {
    event.preventDefault();
    $(this).parent().trigger("destroy");
});

http://jsfiddle.net/bhlaird/C5Ent/

Barbara Laird
  • 12,599
  • 2
  • 44
  • 57
  • @JoeAtzberger - I don't have 32, but it seems to be working fine in 33. What behavior are you seeing? – Barbara Laird Feb 24 '14 at 20:20
  • 2
    Ah, I take it back. Must have just been my browser or my brain. Looks fine now. – Joe Atzberger Feb 26 '14 at 17:06
  • Does not work: `Uncaught TypeError: $(...).dotdotdot is not a function` – izogfif Feb 10 '20 at 16:48
  • @izogfif - this plugin has changed significantly since 2013 and the dotdotdot.js file doesn't exist at it's previous location anymore. I suggest looking at https://dotdotdot.frebsite.nl for it's current usage – Barbara Laird Feb 10 '20 at 19:23