当视频正在播放时停止滑块中的自动播放,当视频暂停或结束时移动到下一张幻灯片


<div class="swiper mySwiper">
<div class="swiper-wrapper">
<div class="swiper-slide">
<video-js
id="6304418462001"
class="overlayVideo"
data-account="6269594386001"
data-player="oHG2GzKTGk"
data-embed="default"
controls=""
data-video-id="6304418462001"
data-playlist-id=""
data-application-id=""
data-object-fit="cover"
autoplay
muted
playsinline
>
</video-js>
<script src="https://players.brightcove.net/6269594386001/oHG2GzKTGk_default/index.min.js"></script>
</div>
<div class="swiper-slide">
<video-js
id="4029697544001"
class="overlayVideo"
data-account="1752604059001"
data-player="default"
data-embed="default"
controls=""
data-video-id="4029697544001"
data-playlist-id=""
data-application-id=""
autoplay
muted
playsinline
></video-js>
<script src="https://players.brightcove.net/1752604059001/default_default/index.min.js"></script>
</div>
</div>
<div class="swiper-button-next"></div>
<div class="swiper-button-prev"></div>
<div class="swiper-pagination"></div>
</div>
<script>
$(document).ready(function () {
var swiper = new Swiper(".mySwiper", {
spaceBetween: 30,
centeredSlides: true,
autoplay: {
delay: 2500,
disableOnInteraction: false,
},
pagination: {
el: ".swiper-pagination",
clickable: true,
},
navigation: {
nextEl: ".swiper-button-next",
prevEl: ".swiper-button-prev",
},
});
$(".vjs-tech").on("play", function () {
swiper.autoplay.stop();
});
$(".vjs-tech").on("ended, paused", function () {
swiper.autoplay.start();
});
var sliderVideos = $(".swiper-slide .vjs-tech");
/* SWIPER API - Event will be fired after animation to other slide (next or previous) */
swiper.on("slideChange", function () {
/* stop all videos (currentTime buggy without this loop idea - no "real" previousIndex) */
sliderVideos.each(function (index) {
this.currentTime = 0;
});
/* SWIPER GET CURRENT AND PREV SLIDE (AND VIDEO INSIDE) */
var prevVideo = $(
"[data-swiper-slide-index=" + this.previousIndex + "]"
).find(".vjs-tech");
var currentVideo = $(
"[data-swiper-slide-index=" + this.realIndex + "]"
).find(".vjs-tech");
prevVideo.trigger("stop");
currentVideo.trigger("play");
});
});
</script>

我正在尝试自动滚动滑块。如果当前幻灯片中有视频元素,则应该暂停自动播放,直到视频暂停或完成。如果我暂停当前幻灯片并移动到下一张幻灯片,那么在重访暂停的幻灯片时,视频应该单独保持暂停状态,只有当视频结束并移动到下一张幻灯片时,重访视频才能从头开始播放。目前,一旦循环完成,第二个循环开始,玩家就不会像预期的那样工作。找不到播放器有什么问题

我不确定这会解决你的问题,但在这一部分

$(".vjs-tech").on("ended, paused", function () {
swiper.autoplay.start();
});

应该使用"end","pause"而不是"end "one_answers"paused">