0

いくつかの Twitter Bootstrap カルーセルを使って取り組んでいるブログがあります。キーボード コントロールを有効にするために、次のコードを使用しています。

<!-- Script: Carousel Keyboard controls -->

<script type="text/javascript">

  jQuery(document).bind('keyup', function(e) {

      if(e.which==39){
        jQuery('a.carousel-control.right').trigger('click');
      }   

      else if(e.which==37){
        jQuery('a.carousel-control.left').trigger('click');
      }

  });

</script>

これは魅力のように機能します。ただし、キーボード コントロールを使い始めると、さまざまなカルーセルが存在するため、すべてのカルーセルが同時に変化します。

これを修正する方法はありますか？

これは私が取り組んでいるサイトです: http://rubenparra.com/blog/

ありがとう！

4

2 に答える 2

3

現時点では、左 (または右) のすべてのボタンを同時にクリックしているため、もちろんすべてのカルーセルが同時に変化します。

一度に特定のカルーセルを変更したい場合は、カルーセル ID を使用してこれを防ぐことができます。

<script type="text/javascript">
jQuery(document).bind('keyup', function(e) {
    if (e.which==39) {
        jQuery('#carousel-4627 a.carousel-control.right').trigger('click');
    } else if (e.which==37) {
        jQuery('#carousel-4627 a.carousel-control.left').trigger('click');
    }
});
</script>

また、Bootstrap カルーセルは、これをもう少しエレガントに行うためのメソッドを提供します。

<script type="text/javascript">
jQuery(document).bind('keyup', function(e) {
    if (e.which==39) {
        jQuery('#carousel-4627').carousel('next');
    } else if (e.which==37) {
        jQuery('#carousel-4627').carousel('prev');
    }
});
</script>

お役に立てれば。

于 2013-07-16T17:29:32.520 に答える