ブートストラップのカルーセルを一時停止するビデオを再生するとき

Question

ビデオと画像が複数あるスライドがあります。読み込み時にカルーセルが自動再生に設定されます。しかし、誰かがビデオを再生し、マウスを横から動かすと、スライディング（期待どおり）します。

動画の再生と一時停止の状況をどのように把握できますか？私はSOの周りを検索しましたが、似たような質問は見つかりませんでした。

サイト管理者が後で動画を追加するため、iframeまたはhtml5動画になる可能性があります。だから、私は両方のために働く解決策が必要です。

Answer 1

$（ "＃myCarousel"）。カルーセル（ '一時停止'）; 停止するには $（ "＃myCarousel"）。carousel（）; もう一度起動してください http://www.w3.org/2010/05/video/mediaevents.html このイベントが多数ありますが、もう一度やり直す必要があります。一時停止しても、終了したイベントは起動され、再生中に一時停止します。あなたはそれを統合するが、彼らはそう https://developers.google.com/youtube/js_api_reference#Events は、あなたが耳を傾け、uはHTML5のビデオで行ったようにこれはに私のために働いた

Answer 2

同じ行うことができますイベントが表示されますJS APIを持っているかわからないユーチューブイム用

ネイティブHTML5動画の再生中にブートストラップカルーセルを一時停止し、動画が一時停止または再生終了したときに再生を再開します。私はJSの初心者ですが、一緒にいくつかのことを探し回っていました。私は間違いを犯した可能性がありますが、それは私のために働きます。

カルーセルで再生されているすべての動画で操作する必要があるため、IDで動画を呼び出す予定はありません。私の場合はいくつかあります。

カルーセルのIDをあなたのものに合わせて変更することに注意してください。

<script> 
$('video').on('play', function (e) { 
    $("#portfolioCarousel").carousel('pause'); 
}); 
$('video').on('stop pause ended', function (e) { 
    $("#portfolioCarousel").carousel(); 
}); 
</script>