幻燈片插件的視頻問題

Question

我正在做一個任務，我必須在一些滑塊中實現五個全屏幕背景視頻。

塊獨自工作得很好，我用vide.js，後來我甚至發現這個純粹的CSS解決方案 - http://jsfiddle.net/L8j8oyt8/，但當我將這些塊添加到滑塊插件（嘗試bxslider和flex滑塊），視頻只是不會播放。我在DOM中看到了視頻元素和其他東西，但它不起作用。

我也有奇怪的東西在這裏工作 - http://jsfiddle.net/vgJ9X/1/

<ul class="bxslider"> 
<li> 
    <video autoplay loop controls> 
     <source src="//demosthenes.info/assets/videos/polina.mp4" type="video/mp4"> 
    </video>  
</li> 
<li> 
    <video autoplay loop controls> 
     <source src="//demosthenes.info/assets/videos/polina.mp4" type="video/mp4"> 
    </video>  
</li> 
<li> 
    <video autoplay loop controls> 
     <source src="//demosthenes.info/assets/videos/polina.mp4" type="video/mp4"> 
    </video>  
</li> 
</ul> 

有什麼建議？我正在考慮用1包裝包裝視頻的所有單獨的塊，並簡單地用jquery'模擬'滑塊效果scrollTo（）

Answer 1

好吧，我發現了迄今爲止工作的一種方法。

我做了什麼：

創建無來源，但背景圖像作爲後備視頻元素。

初始化的幻燈片（flexslider，因爲bxslider在平板電腦上滑動時存在一些凍結問題）以及初始化將源添加到每個視頻元素之後。 工作沒有問題。

仍然沒有找到沒有理由爲什麼當您在初始化滑塊之前預定義源時，視頻將無法播放。