Vimeo 视频不适用于 HTML5 标签答案

【问题标题】：Vimeo video not working with HTML5 tagVimeo 视频不适用于 HTML5 标签
【发布时间】：2013-08-25 06:34:58
【问题描述】：

我想为 Vimeo 视频添加一个滑块。我检查了this slider，但它使用了 HTML5 视频标签。当我对 Vimeo 视频 URL 使用相同的标签时，它不起作用。这是我的代码：

<video src="http://player.vimeo.com/video/68866759"></video>

这里是完整的代码：

<html>
<body>
<script type='text/javascript' src='http://amazingslider.com/wp-includes/js/jquery/jquery.js?ver=1.7.2'></script>
<script type='text/javascript' src='http://amazingslider.com/wp-content/plugins/amazingslider-plugin/sharedengine/amazingslider.js?ver=1.6'></script>
<link rel="stylesheet" type="text/css" media="all" href="http://amazingslider.com/wp-content/themes/twentyeleven/style.css" />
<div class="demo-slider">
    <div style="display:block;position:relative;margin:15px auto 30px;" id="amazingslider-11">
        <ul style="display:none;" class="amazingslider-slides">
            <li><img alt="Big Buck Bunny Copyright  Blender Foundation" src="http://amazingslider.com/wp-content/uploads/amazingslider/11/images/big_buck_bunny_480_270.jpg">
                <video src="http://player.vimeo.com/video/68866759" preload="none"></video>
            </li>
            <li><img alt="Elephants Dream Copyright  Blender Foundation" src="http://amazingslider.com/wp-content/uploads/amazingslider/11/images/elephants_dream_480_270.jpg">
                <video src="http://www.youtube.com/embed/TLkA0RELQ1g" preload="none"></video>
            </li>
            <li><img alt="Sintel - Third Open Movie by Blender Foundation" src="http://amazingslider.com/wp-content/uploads/amazingslider/11/images/Sintel_480_270.jpg">
                <video src="http://www.youtube.com/embed/eRsGyueVLvQ" preload="none"></video>
            </li>
        </ul>
        <ul style="display:none;" class="amazingslider-thumbnails">
            <li><img src="http://amazingslider.com/wp-content/uploads/amazingslider/11/images/thumbnails/big_buck_bunny_480_270.jpg"></li>
            <li><img src="http://amazingslider.com/wp-content/uploads/amazingslider/11/images/thumbnails/elephants_dream_480_270.jpg"></li>
            <li><img src="http://amazingslider.com/wp-content/uploads/amazingslider/11/images/thumbnails/Sintel_480_270.jpg"></li>
        </ul>
        <div style="display:none;" class="amazingslider-engine"><a href="http://www.amazingslider.com">jQuery Slider</a></div>
    </div>
    <script src="http://amazingslider.com/wp-content/uploads/amazingslider/11/sliderengine/initslider.js"></script>
</div>
</body>
</html>

【问题讨论】：

Vimeo 为您提供了一个嵌入页面。复制任何 HTML sn-p Vimeo 提供的内容并将其粘贴到 <video> 的位置。

标签： jquery html video slider vimeo

【解决方案1】：

您需要使用我们的嵌入代码才能使其工作。 http://player.vimeo.com/video/68866759 不是一个视频文件，它是一个 HTML 页面，所以把它放在一个视频标签中不会有任何作用。

如果你用这个替换视频标签，它应该可以工作：

<iframe src="//player.vimeo.com/video/68866759" width="960" height="540" frameborder="0" webkitallowfullscreen mozallowfullscreen allowfullscreen></iframe>

【讨论】：

【解决方案2】：

进入你的视频设置和视频文件，在底部有一个名为Use Your Own Player的部分，你会发现有指向您的视频的直接网址。示例：

<video src="http://player.vimeo.com/external/85569724.sd.mp4?s=43df5df0d733011263687d20a47557e4"></video>

注意：这需要 PRO Vimeo 帐户。

【讨论】：

如果您不是内容所有者并且只想在网页上的 Video htnl5 标签上播放 Vimeo 视频，例如 vimeo 主页或@ 987654321@?
我找不到“使用你自己的播放器”，它是否仍然存在？
看看：vimeo.com/help/faq/sharing-videos/… - 只有 PRO 会员才能在自定义/第三方播放器中嵌入视频。
这真的需要 PRO Vimeo 帐户吗？