3

i have created simple Custom webpart. It looks like

enter image description here

in that web part, Description display multiple line . i have used html P tag to display Description value

<p>​Loream Ipsum​Loream Ipsum​Loream Ipsum​Loream Ipsum ​Loream Ipsum​Loream Ipsum​Loream Ipsum​Loream Ipsum​​​​</p>

currently i m trying to hide lines more than two using jquery in all resolution. is that possible ? please suggest something ?

  • 1
    Use CSS to set the height:2em of the P tag and use overflow:hidden – Danny '365CSI' Engelman Mar 29 '16 at 17:52
0
<p>
​Loream Ipsum​Loream Ipsum
​<p id="link">
    Loream Ipsum​Loream Ipsum
</p> 
​Loream Ipsum​Loream Ipsum​Loream Ipsum​Loream Ipsum​​​​</p>

associate 'id' to the 'p' tag and hide the line whichever you want using jquery.

 $("#link").hide()
0

There is a JQuery plugin http://keith-wood.name/more.html you could use. It allows you to truncate text at a given length.

$(selector).more({length: 60});

There are lots of settings that this plugin has.

  $(selector).more({     
              length: 100, // Truncation length     
              leeway: 5, // Overrun allowed without truncation     
              wordBreak: false, // True to break between words, false to break anywhere     
              ignoreTags: ['br', 'hr', 'img'], // Non-terminated tags to ignore     
              toggle: true, // True to toggle, false to display and exit     
              ellipsisText: '...', // Display text for ellipsis     
              moreText: 'Show more', // Display text for more link     
              lessText: 'Show less', // Display text for less link     
              andNext: '', // Selector for any following tags to include in the collapse     
              onChange: null // Callback function when expanded/collapsed 
}); 

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.