title: scrollTo next/prev anchor using arrow keys or button?
body: <p>I've been googling for a week now and I just don't understand how to combine it all :(</p>
  
  <p>I'm making a horizontal website similar to <a href="http://tympanus.net/Tutorials/WebsiteScrolling/" rel="nofollow noreferrer">this</a>, except I want to be able to navigate using arrow keys to move back and forth between sections of the horizontal page similar to <a href="http://www.thinkingforaliving.org/" rel="nofollow noreferrer">this</a>.</p>
  
  <p>The relevant research I've found the following pages:</p>
  
  <ul>
  <li><a href="https://stackoverflow.com/questions/2168739/using-arrow-keys-with-jquery-scrollto">stackoverflow.com/questions/2168739/using-arrow-keys-with-jquery-scrollto</a>  </li>
  <li><a href="http://flesler.blogspot.com/2008/02/jqueryserialscroll.html" rel="nofollow noreferrer">flesler.blogspot.com/2008/02/jqueryserialscroll.html</a>  </li>
  <li><a href="https://stackoverflow.com/questions/1402698/binding-arrow-keys-in-js-jquery">stackoverflow.com/questions/1402698/binding-arrow-keys-in-js-jquery</a>  </li>
  <li><a href="http://jqueryfordesigners.com/adding-keyboard-navigation/" rel="nofollow noreferrer">jqueryfordesigners.com/adding-keyboard-navigation/</a>  </li>
  <li><a href="http://tympanus.net/codrops/2010/06/02/smooth-vertical-or-horizontal-page-scrolling-with-jquery" rel="nofollow noreferrer">tympanus.net/codrops/2010/06/02/smooth-vertical-or-horizontal-page-scrolling-with-jquery</a></li>
  </ul>
  
  <p>The best I've been able to come up with is this but its not working:</p>
  
  <pre><code>$(document).bind('keydown',function(evt) {
          switch(evt.keyCode) {
          case 37:
                evt.preventDefault(); 
                $.scrollTo('+=564px', 800, { axis:'x' }); 
                      break;
                  }
  });
  
  
  $(document).bind('keydown',function(evt) {
          switch(evt.keyCode) {
                      case 39:
                evt.preventDefault();
                $.scrollTo('-=564px', 800, { axis:'x' });
                      break;
                  }
  });
  </code></pre>
  
  <p>Isn't there just a way to create anchors or div classes that can be scrolled to on using the arrow keys or clicking arrow buttons? I'm pretty lost here. Maybe I'm asking too much, but if someone could point me in the right direction I'd be grateful, thanks :)</p>