jquery - Can I Toggle content of Element based on pixel height of element? -

using bootstrap 2.3.2 i've used toggle button show , hide text using collapse plugin see allows me reveal , hide entire contents of element.

what need have 170px of element's content visible , when button clicked, reveals rest of text in element - need without adding additional elements, needs based on height.

is possible bootstrap? or if not, jquery?

this can done using css element styling , applying classes via javascript:

the html:

<div class="toggle"> huge text here... </div> 

css:

.toggle{     height:170px; } .open{     height:auto; } 

and js (using jquery):

$('.toggle').on('click', function () {     $(this).toggleclass('open'); }); 

what script detect when click on .toggle and, if clicked, toggles class .open sets propertie height auto, leading element text huge can grow.

here working example: http://jsfiddle.net/8sxnz/1/