仅在播放时显示视频控件,不在加载时显示
Displaying video controls only on playback, not on load
我对嵌入带有可点击缩略图的视频有疑问。我正要修改视频标签以显示点击播放的海报图片:
<video width="569" height="569" controls="controls" poster="images/thumbnail.png" onclick="this.play()"><source type="video/mp4" src="videos/clip.mp4" /></video>
但是,视频控制栏在加载时显示在海报图像上。是否可以修改此代码,以便控制栏仅在视频开始播放后出现?我可以将控制标签全部省略,但它根本不会出现。
如果有人有任何想法或者我是否可以尝试其他方法,请告诉我。
谢谢!
简单排除controls
属性,然后使用onclick事件设置为true。如果你想稍后删除它们,你可以将属性设置为 false
<video width="569" height="569" poster="images/thumbnail.png" onclick="this.controls=true;this.play()"><source type="video/mp4" src="videos/clip.mp4" /></video>
我对嵌入带有可点击缩略图的视频有疑问。我正要修改视频标签以显示点击播放的海报图片:
<video width="569" height="569" controls="controls" poster="images/thumbnail.png" onclick="this.play()"><source type="video/mp4" src="videos/clip.mp4" /></video>
但是,视频控制栏在加载时显示在海报图像上。是否可以修改此代码,以便控制栏仅在视频开始播放后出现?我可以将控制标签全部省略,但它根本不会出现。
如果有人有任何想法或者我是否可以尝试其他方法,请告诉我。
谢谢!
简单排除controls
属性,然后使用onclick事件设置为true。如果你想稍后删除它们,你可以将属性设置为 false
<video width="569" height="569" poster="images/thumbnail.png" onclick="this.controls=true;this.play()"><source type="video/mp4" src="videos/clip.mp4" /></video>