Hi i noticed that whenever i expanded the text, the subsequent text expanded.
and the expand prefix... also tends to be on the next line. Please advise. This is my expand code. $(document).ready(function() { // override some default options $('div.expandable div').expander({ slicePoint: 160, // default is 100 expandText: '<div class="expand- button"> Expand</div>', // default is 'read more...' //expandSpeed: '2000', // speed in milliseconds of the animation effect for expanding the text //expandPrefix: '...', expandEffect: 'fadeIn', collapseTimer: 0, // re-collapses after 5 seconds; default is 0, so no re-collapsing userCollapseText: 'Collapse' , // default is '[collapse expanded text]' afterExpand: function($thisElement) { var vendorParaID = $thisElement.attr('id'); var underscore = vendorParaID.indexOf('_'); var vendorID = vendorParaID.substring(0, underscore); $("#vendor_img_"+vendorID).replaceWith($preloadImgVendor [vendorID]); var heightOfDIV = $thisElement.height(); if(heightOfDIV > 290){ $thisElement.attr({style : "height:290px;overflow:auto"}); } //console.debug($thisElement); }, onCollapse: function($thisElement, byUser) { //alert($thisElement.attr('id')); var vendorParaID = $thisElement.attr('id'); var underscore = vendorParaID.indexOf('_'); var vendorID = vendorParaID.substring(0, underscore); $("#vendor_img_"+vendorID).replaceWith($preloadImgVendorCrop [vendorID]); var heightOfDIV = $thisElement.height(); if(heightOfDIV > 68){ $thisElement.removeAttr("style"); } //console.debug($thisElement); } }); }); This is my div for the expandable. <div class="expandable" > <div id="{$vender.id_manufacturer} _desc">{$vender.description}</div> </div>