Question

我在bxslider上遇到问题（Firefox mac）并在下一张幻灯片上获得空白视频。

不确定是什么问题，当我检查其他浏览器时看起来不错

这是我的测试链接 - http://elixirbox.com/temp/bxslider/

这是我的js代码

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


$('iframe').each(function()
     {var url = $(this).attr("src");
      var result = url.search(/youtube/i);
      if(result!=-1)
       {result = url.indexOf('?');
        if(result!=-1)  
          {$(this).attr("src",url+"&wmode=transparent");
          } else {$(this).attr("src",url+"?wmode=transparent");}
       }
     });
      });

这是我的HTML代码

<div  style="width:500px; margin:0 auto">
<ul class="bxslider">
<li>
    <iframe src="http://player.vimeo.com/video/51686357" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
</li>
<li>
    <iframe title="YouTube video player" width="307" height="190" src="http://www.youtube.com/embed/yX93uJshpj0" frameborder="0" wmode="Opaque" allowfullscreen=""></iframe>
</li>
<li>
    <iframe src="http://player.vimeo.com/video/51686357" width="500" height="281" frameborder="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen></iframe>
</li>
</ul>
</div>

Answer 1

我不知道你是否已找到解决方案，但我已经看到了两个建议。

将useCSS：false添加到函数调用中。
在YouTube通话结束时添加？wmode = opaque（或者＆amp; wmode = opaque，如果您已经使用过？）。

Answer 2

在将swf文件嵌入到bxslider中时，我遇到了与Firefox相同的问题（Chrome和IE很好）。将wmode =“opaque”添加到＆lt; object＆gt;标记并将bxslider配置“视频”更改为false将使其完美运行。我的代码：

<li>
  <object type="application/x-shockwave-flash" data="210240.swf" width="260px" height="110px" id="p_2730_w_318" wmode="opaque"></object>
</li>

<script type="text/javascript">
$(document).ready(function(){
  $('.bxslider').bxSlider({
    //video: true   
  });
});
</script>

Bxslider在Firefox mac的下一张幻灯片上显示空白

2 个答案: