Question

我使用以下内容将视频放在wordpress网站上：

<param name="src" value="http://www.mywebsite.com/announcement.mov">
<param name="autoplay" value="true">
<param name="type" value="video/quicktime" height="560" width="950">

<embed src="http://www.mywebsite.com/announcement.mov" height="560" width="950" autoplay="false" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/">

我不喜欢的部分是，只要您在页面上，就可以看到视频的开始帧。我希望如果有一种方法可以让它显示为黑色或显示空白屏幕，直到您点击播放按钮。

Answer 1

您可能希望在Stack Overflow上的此主题中使用视频占位符：How to add a splash screen/placeholder image for a YouTube video

需要考虑的一点是：如果jQuery / JavaScript失败，视频也不会加载。

<强>更新

在您的HTML中：

<img class="video-placeholder" src="placeholder.jpg" data-video="http://www.mywebsite.com/announcement.mov">

在你的JS文件中：

$('.video-placeholder').click(function(){
    var video = '<param name="src" value="' + $(this).attr('data-video') + '">
    <param name="autoplay" value="true">
    <param name="type" value="video/quicktime" height="560" width="950">
    <embed src="' + $(this).attr('data-video') + '" height="560" width="950" autoplay="false" type="video/quicktime" pluginspage="http://www.apple.com/quicktime/download/">';
    $(this).replaceWith(video);
});

如何在播放之前隐藏视频？

1 个答案: