2013-08-25 66 views
8

Tôi muốn thêm thanh trượt vào video Vimeo. Tôi đã kiểm tra this slider, nhưng nó sử dụng thẻ video HTML5. Khi tôi sử dụng cùng một thẻ với URL video Vimeo thì nó không hoạt động. Đây là mã của tôi:Video Vimeo không hoạt động với thẻ HTML5

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

Dưới đây là toàn bộ mã:

<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 cung cấp cho bạn một trang để nhúng. Sao chép bất kỳ đoạn mã HTML nào mà Vimeo cung cấp cho bạn và dán nó vào vị trí của '

Trả lời

0

Bạn sẽ cần phải sử dụng mã nhúng của chúng tôi cho nó để làm việc. http://player.vimeo.com/video/68866759 không phải là tệp video, đó là trang HTML, vì vậy việc đặt nó vào thẻ video sẽ không làm bất kỳ điều gì.

Nếu bạn thay thế thẻ video với điều này cần làm việc:

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

20

Đến bạn Video SettingsVideo File, ở phía dưới có một phần gọi là Sử dụng riêng của bạn Người chơi, bạn sẽ tìm thấy các url trực tiếp cho video của mình. Ví dụ:

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

Lưu ý: Điều này đòi hỏi một tài khoản PRO Vimeo.

+2

Có cách nào để tìm các url trực tiếp đó cho video nếu bạn không phải là chủ sở hữu nội dung và chỉ muốn phát video Vimeo trên thẻ video htnl5 trên trang web như trang chủ vimeo chẳng hạn hoặc http://summitdublin.com/ ? – Ajar

+2

Tôi không thể tìm thấy "Sử dụng trình phát của riêng bạn", nó vẫn tồn tại hay không? – edonbajrami

+4

@edonbajrami của nó vẫn còn đó như của ngày hôm nay. Tuy nhiên chúng tôi có một tài khoản Vimeo chuyên nghiệp ... – BenRacicot