
			
			$(function()
			{
				// this initialises the demo scollpanes on the page.
				$('#pane1').jScrollPane();
				$('#pane2').jScrollPane({showArrows:true});
				$('#pane3').jScrollPane({scrollbarWidth:20, scrollbarMargin:10, animateTo:true});
                
                // this initialises the scrollBy and scrollTo links.
                $('.scroll-to-demo').bind(
                    'click',
                    function()
                    {
                        $('#pane1')[0].scrollTo(200);
                        return false;
                    }
                );
                
                $('.scroll-by-demo').bind(
                    'click',
                    function()
                    {
                        $('#pane2')[0].scrollBy(parseInt($(this).attr('rel')));
                        return false;
                    }
                );
                
                var $targets = $('#pane3-scroll-targets');
                var $pane3 = $('#pane3');
                var pane3top = parseInt($pane3.offset().top);
                $('#pane3 p').each(
                    function(index)
                    {
                        $targets.append(
                            $('<li></li>').append(
                                $('<a></a>')
                                    .attr({'href':'javascript:;', 'rel':$(this).offset().top})
                                    .text('Scroll to paragraph ' + (index+1))
                                    .bind(
                                        'click',
                                        function()
                                        {
                                            $pane3[0].scrollTo(parseInt($(this).attr('rel')) - pane3top);
                                        }
                                    )
                                )
                        );
                    }
                );
				
				// Set up #pane4 and the links which scrollTo elements within it
				
                var $pane4 = $('#pane4');
				$pane4.jScrollPane({animateTo:true});
				$('a.scroll-to-element-demo').bind(
					'click',
					function()
					{
						var targetElementSelectorString = $(this).attr('rel');
						$pane4[0].scrollTo(targetElementSelectorString);
						return false;
					}
				);
                
			});

