$(function()
{
// this initialises the scollpanes on the page.
$('#scrollable_content').jScrollPane({scrollbarWidth:10, showArrows: true, dragMaxHeight: 30, reinitialiseOnImageLoad: true });
});


/*
scrollbarWidth [int] - the width of the created scrollbar in pixels (defaults to 10)
scrollbarMargin [int] - the margin to leave to the left of the scrollbar in pixels (defaults to 5)
wheelSpeed [int] - controls how fast the mouse wheel makes the content scroll in pixels (defaults to 18)
showArrows [boolean] - controls whether to display arrows for the user to scroll with (defaults to false)
arrowSize [int] - the height of the arrow buttons if showArrows=true (calculated from CSS if not provided)
animateTo [boolean] - whether to animate when calling scrollTo and scrollBy (defaults to false)
dragMinHeight [int] - the minimum height to allow the drag bar to be (defaults to 0)
dragMaxHeight [int] - the maximum height to allow the drag bar to be (defaults to 99999!)
animateInterval [int] - The interval in milliseconds to update an animating scrollPane (default 100)
animateStep [int] - The amount to divide the remaining scroll distance by when animating (default 3)
maintainPosition [boolean] - Whether you want the contents of the scroll pane to maintain it's position when you re-initialise it - so it doesn't scroll as you add more content (default true)
scrollbarOnLeft [boolean] - Whether the scrollbar should appear on the left hand side of the panes content (make sure your CSS also reflects this)
reinitialiseOnImageLoad [boolean] - Whether the jScrollPane should automatically re-initialise itself when any contained images are loaded (defaults to false)
*/