Tạm dừng băng chuyền Bootstrap Khi video đang phát

Question

Tôi có nhiều trang trình chiếu với video và hình ảnh. Băng chuyền được đặt thành tự động phát khi được tải. Nhưng khi ai đó phát video và di chuyển chuột ra khỏi nó, nó vẫn trượt (như mong đợi).

Làm cách nào để theo dõi thời điểm video đang phát và tạm dừng? Tôi có tìm kiếm xung quanh SO nhưng không tìm thấy câu hỏi tương tự.

Quản trị viên trang web sẽ thêm video sau này để chúng có thể là iframe hoặc video html5. Vì vậy, tôi cần một giải pháp hoạt động cho cả hai.

Answer 1

$ ("# myCarousel"). Carousel ('pause'); để dừng nó $ ("# myCarousel"). Carousel(); để bắt đầu lại một lần nữa http://www.w3.org/2010/05/video/mediaevents.html có nhiều sự kiện bạn nên bắt đầu lại ngay cả khi tạm dừng, các sự kiện đã kết thúc được kích hoạt và tạm dừng khi phát.

cho youtube im không chắc chắn về cách bạn tích hợp nó nhưng họ có js api để https://developers.google.com/youtube/js_api_reference#Events sẽ cho bạn thấy sự kiện mà bạn có thể lắng nghe và làm tương tự như u đã làm với video html5

Answer 2

này đã làm việc cho tôi để tạm dừng băng chuyền Bootstrap khi video HTML5 gốc phát và phát lại khi video bị tạm dừng hoặc phát xong. Tôi là một người mới làm quen với JS nhưng tôi đã tìm kiếm xung quanh và xâu chuỗi vài thứ lại với nhau. Tôi có thể đã phạm sai lầm (có thể) nhưng nó làm việc cho tôi.

Tôi không gọi video theo ID vì tôi muốn tác vụ hoạt động trên bất kỳ video nào phát trong băng chuyền. Tôi có một vài trong trường hợp của tôi.

Lưu ý thay đổi ID của băng chuyền để khớp với băng chuyền của bạn.

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