Question

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

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

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>

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

Roundabout jQuery插件按键箭头键向左移动

1 个答案: