2

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 the 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?

Marlon
  • 597
  • 2
  • 8
  • 17

1 Answers1

2

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/

david
  • 4,218
  • 3
  • 23
  • 25
  • That was a very interesting way to use the scroll effects!! I learned a lot from it, but not necessarily how to do exactly what I was looking for. It definitely made me think more about what I was doing though. – Marlon Oct 11 '11 at 16:09