Fancybox iframe 未出现答案

【问题标题】：Fancybox iframe does not appearFancybox iframe 未出现
【发布时间】：2016-08-02 20:51:07
【问题描述】：

HTML

<a class="fancybox fancybox.iframe" href="http://www.youtube.com/embed/L9szn1QQfas">Youtube (iframe)</a>

此代码行有效，但我想动态添加 javascript 代码。

'<li>' +
'<div class="list-left">' +
'<img src="' + thumb + '">' +
'</div>' +
'<div class="list-right">' +
'<a class="fancybox fancybox.iframe" href="http://www.youtube.com/embed/' + videoID + '"><h3>' + title + '</h3></a>' +
'<small>By <span class="Title">' + channelTitle + '</span> on ' + videoDate + '</small>' +
'<p>' + description + '</p>' +
'</div>' +
'</li>' +
'<div class="clearfix"></div>' +
'';

当我点击链接时，我无法使用fancybox 打开。它打开了新页面，控制台说

Mixed Content: The page at 'https://www.youtube.com/embed/OFMSUI7PAS8'
was loaded over HTTPS, but requested an insecure image 
'http://www.youtube.com/favicon.ico'. This content should also be served over HTTPS.

【问题讨论】：

尝试将您的href 更改为https 而不是http
尝试将youtube 链接更改为另一个链接，例如google.com 并告诉我们是否一切正常
改成google后，console error message改了吗？
控制台错误消息消失。现在我显然收到GET http://google.com/embed/mUP0tx7Ib2w 404 (Not Found) 错误。
不，我的意思是将整个href 更改为www.google.com，将<a class="fancybox fancybox.iframe" href="http://www.youtube.com/embed/' + videoID + '"><h3>' + title + '</h3></a> 替换为<a class="fancybox fancybox.iframe" href="www.google.com"><h3>' + title + '</h3></a> 并报告结果。

标签： javascript jquery iframe fancybox

【解决方案1】：

更新

我刚刚使用了您的pen，一切正常，您忘记将type: 'iframe' 传递给fancybox，您还应该将您的js 代码放在codepen 的js 部分，这是屏幕截图

这里是 codepen 的链接：Click me

【讨论】：

@KaanKaraca 我刚刚更新了jsfiddle 链接。请检查一下。
是的，jsfiddle 链接有效，但仍然无效。我上传到 GitHub。能查吗？github.com/h4yfans/Projects-in-JavaScript/tree/master/…看getOutput函数
@KaanKaraca github 没有帮助，你能提供 jsfiddle 链接吗？
codepen.io/h4yfans/pen/vKzQLP。我在这里使用codepen和同样的问题。我不会用fancybox打开。
xD，随意制作自己的 ;)，顺便说一句，如果你得到答案，请将其标记为答案，以帮助未来的读者。