2013-08-25 12 views
8

Vimeoビデオにスライダーを追加したいと思います。私はthis sliderをチェックしましたが、HTML5ビデオタグを使用しています。 Vimeoの動画URLで同じタグを使用すると、そのタグは機能しません。ここに私のコードは次のとおりです。VimeoビデオがHTML5タグで動作しない

<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> 
+0

Vimeoは埋め込むページを提供します。 Vimeoがあなたに与えたHTMLスニペットをコピーし、 '

答えて

0

それを動作させるためにあなたは私たちの埋め込みコードを使用する必要があります。 http://player.vimeo.com/video/68866759は動画ファイルではなく、HTMLページなので、動画タグに入れると何もできません。あなたはこれでvideoタグを交換する場合

それが動作するはずです:

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

20

Go]をごビデオ設定ビデオファイルに、は独自のものを使用すると呼ばれるセクションがあります下にありますプレーヤー、ビデオに直接URLがあります。例:

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

注:これは、PRO Vimeoのアカウントが必要です。

+2

あなたがコンテンツの所有者でなく、単にvimeoホームページやhttp://summitdublin.com/のようなWebページ上のVideo htnl5タグでVimeoの動画を再生したい場合、その動画の直接URLを見つける方法はありますか? – Ajar

+2

"自分のプレーヤーを使用する"が見つからない、それはまだ存在するかどうか? – edonbajrami

+4

@ edonbajrami今日もそのままです。しかし私たちはプロVimeoアカウントを持っています... – BenRacicot

関連する問題