幻灯片插件的视频问题

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在平板电脑上滑动时存在一些冻结问题）以及初始化将源添加到每个视频元素之后。 工作没有问题。

仍然没有找到没有理由为什么当您在初始化滑块之前预定义源时，视频将无法播放。