$a = 50;
function expandPreview(obj){
    //alert(obj);
	$a++;
    $(obj).css("z-index", $a);
	$(obj).css("display", "block");
}
function resetPreview(obj){
    //alert(obj);
	$(obj).css("display", "none");
}
$(document).ready(function() { 
	$('dl.expander dd:eq(0)').expander();      
	$('dl.expander dd:gt(0)').expander({     
		collapseTimer: 4000,     
		beforeExpand: function($thisElement) {       
			$thisElement.parent().parent().append('<div>before expand.</div>');     
		},     
		afterExpand: function($thisElement) {       
		$thisElement.parent().parent().append('<div>after expand</div>');     
		},     
		onCollapse: function($thisElement, byUser) {       
			if (byUser === true) {         
				$thisElement.parent().parent().append('<div class="success">on collapse (by user).</div>');                 
			} else {         
				$thisElement.parent().parent().append('<div class="success">on collapse (by timer).</div>');       
			}     
		}        
	}); 

$.fn.expander.defaults = {
slicePoint:       400,  // the number of characters at which the contents will be sliced into two parts. 
                            // Note: any tag names in the HTML that appear inside the sliced element before 
                            // the slicePoint will be counted along with the text characters.

}
});
