How to hide/show more text within a certain length (like youtube)

by

The secret about this effect, is wrapping the parts that you want to control with HTML tags.

$(".more").toggle(function(){
    $(this).text("less..").siblings(".complete").show();    
}, function(){
    $(this).text("more..").siblings(".complete").hide();    
});

<span class="teaser">text goes here</span>

<span class="complete"> this is the 
complete text being shown</span>

<span class="more">more...</span>

Online demo here: http://jsfiddle.net/zA23k/215/

More Related Contents:

  1. How can I use JQuery to post JSON data?
  2. Is it possible to use jQuery .on and hover?
  3. How to send a PUT/DELETE request in jQuery?
  4. How can I convince IE to simply display application/json rather than offer to download it?
  5. Send JSON data via POST (ajax) and receive json response from Controller (MVC)
  6. How can I post an array of string to ASP.NET MVC Controller without a form?
  7. jQuery Date Picker – disable past dates
  8. How to trigger click event on href element
  9. Using jQuery to build table rows from AJAX response(json)
  10. Get data from file input in JQuery
  11. jqGrid resolve the grid pager ID dynamically?
  12. jQuery load external site page
  13. jQuery & Prototype Conflict
  14. Set width of a “Position: fixed” div relative to parent div
  15. What is “traditional style of param serialization’ in JQuery
  16. How to send request parameter array to servlet using jQuery $.ajax?
  17. jQuery delay not working
  18. jQuery Set Mouse Position (not cursor position)
  19. Jquery resizing image
  20. jQuery UI Dialog Button Icons
  21. jquery datetime picker set minDate dynamic
  22. Calling function after .load (Jquery)
  23. Set the selected index of a Dropdown using jQuery
  24. jQuery: selector (classname with space)
  25. Getting fullscreen mode to my browser using jquery
  26. Click event called twice on touchend in iPad
  27. Use requirejs and jquery, without clobbering global jquery?
  28. jquery: ajax POST inside a form – prevent form submission on ajax call
  29. Possible to have a floating horizontal scrollbar?
  30. addClass and removeClass in jQuery – not removing class

Leave a Comment