How do I build an accelerating scroll affect using javascript?

I am new to javascript, which so many of you know, and I am finding that the actual application of all the things I learned evades me. If you just give me the code, that probably won't help me; I need a break down of how and why things work as far as scrolling a page.

The idea is to start on page one. So I need a function that will start on page one. There is an arrow facing up, down, left, and right. Clicking them will smooth scroll you to the direction indicated.

It's a simple enough idea, the thought of having a page larger than the screen area that can be navigated through scrolling, albeit in a fashion that will ensure you only see one screen at a time.

I have an idea of the things I would need, but I am not exactly sure.

I will need to determine t开发者_Go百科he size of each portion of the page that will be scrolled to. With this, I determine the distance to scroll and which direction.

I then need to build the actual function that scrolls in the appropriate direction.

pseudo-code

html

<div id="arrowRight" onClick="scrollRight">

js



  function scrollRight()
  {
  window.scrollBy("widthOfCurrentPage",0);
  setTimeout("scrollScroll()", 100);
  }

Then I somehow need to stop the function. Since each arrow will get an onClick event handler (I think that's the proper terminology) then I can build 4 functions. One for scrolling right, left, etc. and use them with the appropriate arrows.

But how do I actually do it and am I on the right track?

sounds like your on the right track, youngpup has some nice examples and his comments would help you to understand how it works, and guide you http://www.youngpup.net/projects/ypSimpleScroll/