web-dev-qa-db-ja.com

ブートストラップカルーセル：自動スライドを削除

ブートストラップカルーセルを使用しています。私が望むのは、ナビゲーションまたはページネーションがクリックされたときにのみスライダーがスライドすることです。取り外してみました

$('.carousel').carousel({
    interval: 6000
});

それは正常に動作しますが、私の問題は、ナビゲーションまたはページネーションをクリックした後、自動スライドするようになったことです。自動スライド機能を削除することはできますか？もしそうなら、どのように？

javascriptjquerytwitter-bootstrap
100
khatz0406

追加してみてください：

interval: false

ミリ秒が追加されず、次にスライドすることはないため、自動スライドが停止します。

194
Iliya Reyzis

公式ドキュメント から：

intervalアイテムを自動的に循環させるまでの遅延時間。 falseの場合、カルーセルは自動的に循環しません。

この値をjavascriptまたはdata-interval="false"属性を使用して渡すことができます。

99
Diego Agulló

DIVタグにもう1つの属性を追加するだけです。

data-interval="false"

jSに触れる必要はありません！

44
Nikunj Dhimar

カルーセルdivのdata-interval = "false"への変更/追加

<div class="carousel slide" data-ride="carousel" data-type="multi" data-interval="false" id="myCarousel">
27
Arun

以下を試してください：

<script>
    $(document).ready(function() {      
        $('.carousel').carousel('pause');
    });
</script>
6
Nikit Barochiya

data-interval = "false"

これを対応するdivに追加します...

4
user6560814
$(document).ready(function() {
  $('#media').carousel({
    pause: true,
    interval: 40000,
  });
});

上記のスクリプトを使用すると、画像を自動的に移動できます

$(document).ready(function() {
  $('#media').carousel({
    pause: true,
    interval: false,
  });
});

上記のスクリプトを使用すると、intervalはfalseであるため、auto-rotationがブロックされます

3
Nitin Anvekar