Jquery & JscrollPane - ScrollBy function in javascript

[cjay175]

Hi all,

Thanks for any help anyone could give.

I am using Jscrollpane to customize my scroll bars. I have the plugin working but what I am wondering is how to implement scrollBy function to scroll by paragraphs.

This is what I currently have:

Head section script:

<script type="text/javascript">
			$(function(){
			// this initialises the demo scollpanes on the page.
			$('.scroll-pane').jScrollPane();
			
			$('.scroll-by-demo').bind('click',function(){
                        $('.scroll-pane')[0].scrollBy(parseInt($(this).attr('rel')));
                        return false;
                    });
		});
                </script>

Links

<li><a class="scroll-by-demo" rel="#p" href="noJS.html">scroll down paragragh</a></li>
<li><a class="scroll-by-demo" rel="-#p" href="noJS.html">scroll up by paragraph</a></li>

Element container (HTML)

<div class="scroll-pane" style="overflow:auto; height:100%; text-align:left;">
<b>Some title</b> <br />
<?php

include ('news_file.html');

?> 
</div>

So basically when someone clicks the links it will scroll them down or up a paragraph. I am trying to do this instead of having a link for each paragraph.

I imagine you have to us elements of some sort in the script but I am not very good at javascript or jquery (trying to learn as I go), any help is appreciated. Thanks