更改中心上的HTML5视频按钮

有没有方法可以更改HTML5视频标签中心的按钮？我尝试了定位视频的容器，并添加另一个绝对定位的div内的按钮作为背景，并添加了一个脚本，可以触发play（）;事件并没有奏效。更改中心上的HTML5视频按钮

以下是截图：video

这里是我的HTML：

<div id="freq-content"> 
    <div class="custom-play"></div> 
    <video controls> 
     <source src="_assets_/video/videoplayback.mp4" type="video/mp4"> 
    </video> 
</div><!-- /#freq-content -->

这里是我的jQuery：

$('.custom-play').click(function(){ 
    $(this).hide(); 
    $('#freq-content video').play(); 
});

这里是我的CSS：

#freq-content{position:relative} 
#freq-content video{height:750px;width:100%} 
.custom-play{position:absolute;left:0;top:0;right:0;bottom:0;background:url(../images/button-play.png) center center no-repeat}

我想中央按钮是这样的：视频标签下方enter image description here

来源

2016-09-16 Chawdiee

需要一些代码来获取感。 –

嗨，Pranesh。我更新了我的问题。 – Chawdiee

您在JQuery对象上调用'.play（）'，而不是DOM元素。看看这个：http://stackoverflow.com/questions/4646998/play-pause-html-5-video-using-jquery – DBS

移动定制玩法：

<div id="freq-content">  
     <video controls> 
     <source src="_assets_/video/videoplayback.mp4" type="video/mp4"> 
     </video> 
<div class="custom-play"> </div> </div>

来源

2016-09-16 20:09:28 sean

更改中心上的HTML5视频按钮

回答

相关问题