jquery-plugins - Roundabout jQuery 插件 keypress 方向键 左右移动

Question

我正在使用 Roundabout 插件（http://fredhq.com/projects/roundabout），但无法弄清楚如何使用预设的可调用方法，例如使用左/右箭头键在按键上动画到下一个/上一个。

我可以在不使用这些预设的情况下让按键正常工作，但我真的想在各种按键上使用预设类。有任何想法吗？

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

Answer 1

这对我有用

的HTML

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

查询设置

<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");
    }
});