扬声器盒子里的扬声器

Question

speakerdeck

使用脚本嵌入呼叫，该调用将设置API和JSON响应，例如：

{
    "version": "1.0",
    "type": "video",
    "provider_name": "YouTube",
    "provider_url": "http://youtube.com/",
    "width": 425,
    "height": 344,
    "title": "Amazing Nintendo Facts",
    "author_name": "ZackScott",
    "author_url": "http://www.youtube.com/user/ZackScott",
    "html":
        "<object width="425" height="344">
            <param name="movie" value="http://www.youtube.com/v/M3r2XDceM6A&fs=1"></param>
            <param name="allowFullScreen" value="true"></param>
            <param name="allowscriptaccess" value="always"></param>
            <embed src="http://www.youtube.com/v/M3r2XDceM6A&fs=1"
                type="application/x-shockwave-flash" width="425" height="344"
                allowscriptaccess="always" allowfullscreen="true"></embed>
        </object>",
}

简单地放置扬声器嵌入链接，例如：

<script async class='speakerdeck-embed' data-id='4ece03012a0554004f008afa' data-ratio='0.9534450651769087' src='//speakerdeck.com/assets/embed.js'></script>

效果很好，但是我无法将其与 fancybox v2 集成在一起。但是，运行a href="script"的问题似乎比使用Fancybox Iframe中的oembed api json更重要。（但不确定。）

所以我将其分解为仅通过a href="script"链接启动脚本的最低限度 - 因为Fancybox使用了A元素 - 我尝试了一些变体：

<a href="javascript(async class='speakerdeck' data-id='4ece03012a0554004f008afa' data-ratio='0.9534450651769087' src='//speakerdeck.com/assets/embed.js')" >show it</a>

我得到的只是一个旋转装载机图标，更糟。

我认为我只是对显而易见的心理错误，您能帮忙吗？

Answer 1

如果您已经拥有 data-id='4ece03012a0554004f008afa'，那就像通过

这样的embed方法将其直接传递到href链接一样简单

<a class="fancydeck" href="http://speakerdeck.com/embed/4ece03012a0554004f008afa">CLICK to open speakerdeck inside fancybox</a>

然后只使用此Fancybox自定义脚本

$(document).ready(function() {
 $(".fancydeck").fancybox({
  type : "iframe",
  width: 640, // or whatever
  height : 420,
  fitToView : false
 });
}); // ready

请参阅演示

NOTE ：我在演示中使用Fancybox 2.x，但我不明白为什么不适用于v1.3.4