// you can override default options globally, so they apply to every .expander() call
//$.expander.defaults.slicePoint = 120;

$(document).ready(function() {
  // simple example, using all default options unless overridden globally
  //$('div.expandable').expander();

  // *** OR ***

  // override default options (also overrides global overrides)
  $('div.expandable').expander({
    slicePoint:       420,  // default is 100
	preserveWords: true, // hele woorden
	widow: 15,
	// effects for expanding and collapsing
	expandEffect: 'fadeIn',
	expandSpeed: 450,
	collapseEffect: 'fadeOut',
	collapseSpeed: 300,

// allow the user to re-collapse the expanded text.
	userCollapse: true,
	
    expandPrefix:     '[...] ', // default is '... '
    expandText:       '<u STYLE=\"FONT-SIZE:90%; FONT-WEIGHT:BOLD;\">lees meer</u>...', // default is 'read more'
    collapseTimer:    0, // re-collapses after 5 seconds; default is 0, so no re-collapsing
    userCollapseText: '<u STYLE=\"FONT-WEIGHT:BOLD;FONT-SIZE:90%;\">lees minder</u>'  // default is 'read less'
  });
  $('div.expandable2').expander({
    slicePoint:       350,  // default is 100
	preserveWords: true, // hele woorden
	widow: 15,
    expandPrefix:     '[...] ', // default is '... '
    expandText:       '<br \><u STYLE=\"FONT-SIZE:75%; FONT-WEIGHT:BOLD;\">read more</u>...', // default is 'read more'
    collapseTimer:    0, // re-collapses after 5 seconds; default is 0, so no re-collapsing
    userCollapseText: '<u STYLE=\"FONT-WEIGHT:BOLD;\">read less</u>'  // default is 'read less'
  });

});