使用bxslider滑动多个视频文件

时间:2014-04-30 01:20:56

标签: javascript html bxslider

我在谷歌浏览器中使用了bxslider,我的视频不会显示在滑块面板中。它们只是在页面上一个接一个地出现。这是我放在头脑中的javascript代码。

<script>
      $(document).ready(function(){
      $('.bxslider').bxSlider();
      });
</script>

这是包含我的视频并位于正文内部的div元素。

<div class="bxslider">
<div>
<iframe src="videos/video1.mp4" height="400" width="800" id="video1"></iframe>
</div>

<div>
<iframe src="videos/video2.mp4" height="400" width="800" id="video2"></iframe>
</video></div>

<div>
<iframe src="videos/video3.mp4" height="400" width="800" id="video3"></iframe>
</div>

<div>
<iframe src="videos/video4.mp4" height="400" width="800" id="video4"></iframe>
</div>
</div>

1 个答案:

答案 0 :(得分:0)

您所描述的是当插件由于错误而无法运行时会发生什么 - 默认情况下它是HTML的样子。

删除错误的video标记后,似乎可以正常工作。您还有一个拼写错误的结束div标记。

http://jsfiddle.net/isherwood/XWL9Y/

$(document).ready(function () {
    $('.bxslider').bxSlider();
});

考虑下次遇到问题时验证HTML。 http://validator.w3.org/#validate_by_input