I created a website very simmilar to http://themeforest.s3.amazonaws.com/116_parallax/tutorial-source-files/tut-index.html. Now i want to add key navigation. So when I push arrow right it will go to box2, when arrow left go back to Home. I tried this tutorial http://jqueryfordesigners.com/adding-keyboard-navigation/
So:
$().ready(function() { $(document.documentElement).keyup(function (event) { var direction = null; // handle cursor keys if (event.keyCode == 37) { // go left direction = 'prev'; } else if (event.keyCode == 39) { // go right direction = 'next'; } if (direction != null) { $('.coda-slider-wrapper ul a#current').parent()[direction]().find('a').click(); } }); }); And
<div id="header" class="coda-slider-wrapper"> <h1 id="logo">Scrolling Clouds</h1> <ul id="menu"> <li><a href="#box1" class="link" id="current">Home</a></li> <li><a href="#box2" class="link">Box 2</a></li> <li><a href="#box3" class="link">Box 3</a></li> <li><a href="#box4" class="link">Box 4</a></li> </ul> </div> Unfortunetly it wont work properly becouse only one elemnt has id="current". How to get it working? How to add dynamic id? Please write me all the code.
Thx for help.