Breaking News: Grepper is joining You.com. Read the official announcement!

see more in jquery

Syed Umair Hashmi answered on February 19, 2022 Popularity 5/10 Helpfulness 1/10

answer see more in jquery

see more in jquery

Comment

function AddReadMore() {
    //This limit you can set after how much characters you want to show Read More.
    var carLmt = 280;
    // Text to show when text is collapsed
    var readMoreTxt = " ... Read More";
    // Text to show when text is expanded
    var readLessTxt = " Read Less";


    //Traverse all selectors with this class and manupulate HTML part to show Read More
    $(".addReadMore").each(function() {
        if ($(this).find(".firstSec").length)
            return;

        var allstr = $(this).text();
        if (allstr.length > carLmt) {
            var firstSet = allstr.substring(0, carLmt);
            var secdHalf = allstr.substring(carLmt, allstr.length);
            var strtoadd = firstSet + "<span class='SecSec'>" + secdHalf + "</span><span class='readMore'  title='Click to Show More'>" + readMoreTxt + "</span><span class='readLess' title='Click to Show Less'>" + readLessTxt + "</span>";
            $(this).html(strtoadd);
        }

    });
    //Read More and Read Less Click Event binding
    $(document).on("click", ".readMore,.readLess", function() {
        $(this).closest(".addReadMore").toggleClass("showlesscontent showmorecontent");
    });
}
$(function() {
    //Calling function after Page Load
    AddReadMore();
});

Popularity 5/10 Helpfulness 1/10 Language javascript

Source: stackoverflow.com

Tags: javascript jquery

Link to this answer
Share Copy Link

Contributed on Feb 19 2022

Syed Umair Hashmi

0 Answers Avg Quality 2/10

see more in jquery

Contents

More Related Answers

see more in jquery

Grepper

Documentation

Social

Legal

Contact

Oops, You will need to install Grepper and log-in to perform this action.