<div id="carouselExampleIndicators" class="carousel slide carousel-fade" data-ride="carousel">
<ol class="carousel-indicators video-g flex">
<div data-target="#carouselExampleIndicators" data-slide-to="0" class="active video-s">
<video class="fit" loop muted src="img/Pexels%20Videos%202818559.mp4"></video>
</div>
<div data-target="#carouselExampleIndicators" data-slide-to="1" class="video-s">
<video class="fit" loop muted src="img/Pexels%20Videos%202818564.mp4"></video>
</div>
<div data-target="#carouselExampleIndicators" data-slide-to="2" class="video-s">
<video class="fit" loop muted src="img/video.mp4"></video>
</div>
</ol>
<div class="carousel-inner">
<div class="carousel-item active">
<!--轮播视频-->
<div class="video">
<video class="fit" id="video1" autoplay muted loop src="img/Pexels%20Videos%202818559.mp4"
></video>
</div>
<!--轮播视频 结束-->
</div>
<div class="carousel-item">
<!--轮播视频-->
<div class="video">
<video class="fit" id="video2" autoplay loop muted src="img/Pexels%20Videos%202818564.mp4"
></video>
</div>
<!--轮播视频 结束-->
</div>
<div class="carousel-item">
<!--轮播视频-->
<div class="video">
<video class="fit" id="video3" autoplay loop muted src="img/video.mp4"></video>
</div>
<!--轮播视频 结束-->
</div>
</div>
<a class="carousel-control-prev" href="#carouselExampleIndicators" role="button" data-slide="prev">
<span class="carousel-control-prev-icon" aria-hidden="true"></span>
<span class="sr-only">Previous</span>
</a>
<a class="carousel-control-next" href="#carouselExampleIndicators" role="button" data-slide="next">
<span class="carousel-control-next-icon" aria-hidden="true"></span>
<span class="sr-only">Next</span>
</a>
</div>
// 获取第一个video元素
let mainVideo = null;
// 获取所有类名为video-s的盒子做出循环
document.querySelectorAll('.video-s').forEach(item => {
// 返回第一个video元素的节点的属性集合
let video = item.querySelector('video');
// 返回一个添加一个当鼠标指针进入(穿过)元素时,改变元素的背景黄色的事件和
item.addEventListener('mouseenter', () => {
mainVideo = document.querySelector('.carousel-item.active').querySelector('video');
//使第一个video元素暂停
mainVideo.pause();
// 开始
video.play();
});
// 当鼠标离开元素时.背景颜色变为灰色
item.addEventListener('mouseleave', () => {
//使第一个video元素开始
mainVideo.play();
//暂停
video.pause();
});
});
参考这个:https://blog.csdn.net/xingchen678/article/details/100877403
你好,你轮播可以做个判断进行轮播的
下面这个是播放完进行跳转。你参考一下
```html
<video id="MyVideo" src="images/vd.mp4" autoplay muted controls style="width:100%;display:block;margin:0px auto;height:auto"></video>
JS:
<script>
myVid=document.getElementById("MyVideo");
myVid.addEventListener('ended',function(){undefined
window.location.href="https:*****.com";
});
</script>
```