2011-10-15 4 views
0

나는 http://themeforest.s3.amazonaws.com/116_parallax/tutorial-source-files/tut-index.html과 매우 흡사 한 웹 사이트를 만들었습니다. 이제 키 탐색을 추가하고 싶습니다. 따라서 화살표를 오른쪽으로 밀면 화살표 2가 홈으로 돌아갈 때 box2로 이동합니다.키보드 탐색 JQuery

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

이 Unfortunetly는 늘 하나의 elemnt 렸기 때문에 제대로 작동 ID = "현재"를 가지고 : 나는이 튜토리얼 그래서 http://jqueryfordesigners.com/adding-keyboard-navigation/

을 시도했다. 어떻게 작동 시키나요? 동적 ID를 추가하는 방법 제발 모든 코드를 써주세요.

도움이 필요하시면 Thx.

답변

2

현재 연결된 링크에 #current을 설정해야합니다. 그렇게하려면 다음과 같은 코드를 사용하십시오 :

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