2012-10-19 55 views
0

我正在使用Roundabout插件(http://fredhq.com/projects/roundabout),但無法解決如何使用預設的可調用方法,例如使用向左/向右箭頭在按鍵上設置動畫鍵。迂迴jQuery插件按鍵箭頭鍵向左移動

我可以按鍵一般的工作,而無需使用這些預設,但我真的想用各種按鍵的預設類。有任何想法嗎?

的HTML

<div id="carousel-container"> 
    <ul class="roundabout-holder"> 
     <li class="roundabout-moveable-item roundabout-in-focus"></li> 
     <li class="roundabout-moveable-item"></li> 
     <li class="roundabout-moveable-item"></li> 
     <li class="roundabout-moveable-item"></li> 
     <li class="roundabout-moveable-item"></li> 
    </ul> 
    </div> 

jQuery的設立

<script> // Calling the Roundabout plugin 
     $(document).ready(function() { 
      $('ul').roundabout(); 
     }); 
    </script> 

    $(document.documentElement).keyup(function (event) { 
     var direction = null; 
     // handle cursor keys 
     if (event.keyCode == 37) { 
     // go left 
     $('#roundabout-container').roundabout("animateToNextChild"); 
     } else if (event.keyCode == 39) { 
     // go right 
     $('#roundabout-container').roundabout("animateToPreviousChild"); 
     } 
    if (direction != null) { 
     $('ul.roundabout-holder li.roundabout-moveable-item').parent()[direction]().find('a').click(); 
     } 
    }); 

回答

2

這對我的作品

的HTML

<ul class="pasador"> 
     <li><img src="fichas/01.jpg" alt="Award" /></li> 
     <li><img src="fichas/02.jpg" alt="Backpack" /></li> 
     etc ... 
    </ul> 

JQUERY SET UP

<script> 
    $(document).ready(function() { 
     $('ul.pasador').roundabout(); 
    }); 
</script> 

$(document.documentElement).keyup(function(event) { 
    if (event.keyCode == 37) { 
     $('ul.pasador').roundabout("animateToPreviousChild"); 
    } else if (event.keyCode == 39) { 
     $('ul.pasador').roundabout("animateToNextChild"); 
    } 
});