首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >为什么FancyBox上的Youtube视频在移动设备上没有显示?

为什么FancyBox上的Youtube视频在移动设备上没有显示?
EN

Stack Overflow用户
提问于 2016-06-26 23:26:18
回答 1查看 529关注 0票数 0

我正在使用Fancybox显示youtube视频。在PC和MAC中,一切都很好,但在移动设备中却不是这样。我的代码是:

代码语言:javascript
复制
  <div class="gallery slider">
        <div><a class="various fancybox.iframe slick-slide" title="The Falltape" href="http://www.youtube.com/v/ZeStnz5c2GI?fs=1&amp;autoplay=1"><img src="../images/2.jpg"></a></div>
        <div><a class="various fancybox.iframe slick-slide" title="The Barn" href="http://www.youtube.com/v/4tS88S6em8Y?fs=1&amp;autoplay=1"><img src="../images/1.jpg"></a></div>
        <div><a class="various fancybox.iframe slick-slide" title="The Barn" href="http://www.youtube.com/v/4tS88S6em8Y?fs=1&amp;autoplay=1"><img src="../images/2.jpg"></a></div>
        <div><a class="various fancybox.iframe slick-slide" title="The Falltape" href="http://www.youtube.com/v/ZeStnz5c2GI?fs=1&amp;autoplay=1"><img src="../images/2.jpg"></a></div>
        <div><a class="various fancybox.iframe slick-slide" title="The Barn" href="http://www.youtube.com/v/4tS88S6em8Y?fs=1&amp;autoplay=1"><img src="../images/1.jpg"></a></div>
        <div><a class="various fancybox.iframe slick-slide" title="The Barn" href="http://www.youtube.com/v/4tS88S6em8Y?fs=1&amp;autoplay=1"><img src="../images/2.jpg"></a></div>
    </div>

<script type="text/javascript">
        $(document).ready(function() {
            $(".various").fancybox({
                maxWidth    : 800,
                maxHeight   : 600,
                fitToView   : false,
                width       : '70%',
                height      : '70%',
                autoSize    : false,
                closeClick  : false,
                openEffect  : 'elastic',
                closeEffect: 'none',
                type: "iframe",
                iframe: {
                    preload: false
                }
            });
        });

会发生什么事?

当我使用Developer工具时,会显示以下错误:

资源被解释为文档,但使用MIME类型的应用程序/x激波-闪存.text文本传输

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2016-06-27 01:01:59

我终于拿到了。

这里的问题是用于访问Youtube视频的URL。我更改了URL,现在它起作用了:

代码语言:javascript
复制
<div class="gallery slider">
        <div><a class="fancybox fancybox.iframe slick-slide" title="The Falltape" href="https://www.youtube.com/embed/9_bFYdMYG-w?enablejsapi=1&wmode=opaque"><img src="../images/2.jpg"></a></div>
        <div><a class="fancybox fancybox.iframe slick-slide" title="The Barn" href="https://www.youtube.com/embed/9_bFYdMYG-w?enablejsapi=1&wmode=opaque"><img src="../images/1.jpg"></a></div>
        <div><a class="fancybox fancybox.iframe slick-slide" title="The Barn" href="https://www.youtube.com/embed/9_bFYdMYG-w?enablejsapi=1&wmode=opaque"><img src="../images/2.jpg"></a></div>
        <div><a class="fancybox fancybox.iframe slick-slide" title="The Falltape" href="https://www.youtube.com/embed/9_bFYdMYG-w?enablejsapi=1&wmode=opaque"><img src="../images/2.jpg"></a></div>
        <div><a class="fancybox fancybox.iframe slick-slide" title="The Barn" href="https://www.youtube.com/embed/9_bFYdMYG-w?enablejsapi=1&wmode=opaque"><img src="../images/1.jpg"></a></div>
        <div><a class="fancybox fancybox.iframe slick-slide" title="The Barn" href="https://www.youtube.com/embed/9_bFYdMYG-w?enablejsapi=1&wmode=opaque"><img src="../images/2.jpg"></a></div>
    </div>

通过阅读YouTube API文档,明确定义了要使用的URL必须采用以下格式:

https://www.youtube.com/embed/VIDEO

我没有用那种格式。

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/38044096

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档