web-dev-qa-db-ja.com

マウスホバーでBootstrapカルーセルが一時停止し、自動的にサイクリングを続けるのを防ぐことはできますか?

Bootstrapマウスホバー時のカルーセルの一時停止を防止し、代わりにアイテムを自動的に循環し続けることは可能ですか?

ドキュメントにはpause: "hover"のデフォルトの動作のみが記載されていますが、pause引数を他のものに変更すると、カルーセルが完全に機能しなくなるため、このデフォルトの動作を無効にする方法がわかりません。

43
Andy Bowskill

"false"は、マウスオーバー中にカルーセルを循環させ続けます。

$('.carousel').carousel({
    pause: "false"
});

Twitter Bootstrap v2.0.2を使用しています

81
xcer

JavaScriptを使用する代わりに、これをdiv .carouselに追加することもできます。

遅延時間を追加します。

data-interval="3000"

ホバーで一時停止するかどうかを追加します。オプションはtruefalseです

data-pause="false"

例は次のとおりです。

<div id="carousel" class="carousel" data-ride="carousel" data-interval="3000" data-pause="false">

これは私のために働いた。

47
JCBrown
$('.carousel').carousel({
        pause: 'none'
    })

for Bootstrap= v3.3.4

7
wpdevramki

ブートストラップ4ホバー時の一時停止の解除

$('.carousel').carousel({
    interval: 2000,
    cycle: true,
    pause: "null"
})
2
Abdul Razak

まだこのスレッドにアクセスしている場合は、最新バージョンの4.1.3で、引用符なしでnullを使用してください。以前のv.4バージョンでは引用符が必要だったかもしれませんが、今はそうではありません。

$('.carousel').carousel({
    interval: 2000,
    cycle: true,
    pause: null
})
1

このサイクリングと一時停止に依存するものが2つあることがわかりました。

  1. マウスが入ったとき(mouseenter-pause pause
  2. マウスが離れたとき(mouseleave-スライドを再開

Js/bootstrap.jsファイルの次のコード行を変更するだけで、連続スライドが可能になります。

.on('mouseenter', $.proxy(this.pause, this)) to

.on('mouseenter', $.proxy(this.**cycle**, this))

0