Question

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

以下是截图：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

Answer 1

在视频标记下移动自定义播放：

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

更改中心的HTML5视频按钮

1 个答案: