<video width=100% height=100% poster="/images/gongsi.jpg" controls="controls" >
<source src="/images/gongsi.mp4" type="video/mp4"></source>
</video>
<button class="play-button" id="myButton">
<i class="iconfont icon-play" style="font-size:60px;color:#fff;"></i>
</button>
<style>
.play-button{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
z-index:99;
border-radius:50%;
border:none;
cursor:pointer;
background:none;
}
</style>
<script>
const video = document.querySelector('video');
const playButton = document.querySelector('.play-button');
playButton.addEventListener('click',() => {
if(video.paused){
video.play();
}else{
video.pause();
}
});
document.getElementById('myButton').addEventListener('click', function() {this.style.display = 'none';});
</script>