鍵盤導航JQuery

Question

我創建了一個非常類似於http://themeforest.s3.amazonaws.com/116_parallax/tutorial-source-files/tut-index.html的網站。現在我想添加關鍵導航。所以當我向右推箭頭時，它會轉到box2，當箭頭離開時返回到Home。 我想這個教程http://jqueryfordesigners.com/adding-keyboard-navigation/

所以：

$().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(); 
} 
}); 
}); 

而且

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

偏偏它不會becouse只有一個elemnt正常工作具有ID = 「電流」。 如何讓它工作？如何添加動態ID？請給我寫下所有的代碼。

THX的幫助。

Answer 1

您需要設置#current任何鏈接是最新的。要做到這一點，請使用如下代碼：

$(function(){ 
    var list = $('.coda-slider-wrapper ul'); 
    list.find('a').click(function(e){ 
     list.find('a').removeAttr('id'); 
     this.id = 'current'; 
    }); 
});