Question

同一页面（www.goo.gl/xLAhN）使用以下代码在iframe中嵌入了尺寸为640x390的youtube视频:(尝试了3种版本的youtube嵌入代码，但结果相同）

`<iframe id="player" type="text/html" width="640" height="390" src="http://www.youtube.com/embed/GxTl1Ykbuww?enablejsapi=1&origin=origin-domain.com" frameborder="0"></iframe>`

同一页面使用以下代码在iframe中的250x250中嵌入了一个Adsense横幅：

`<script type="text/javascript"><!--
google_ad_client = "ca-pub-xxxxxxxxxxxxx";
/* test */
google_ad_slot = "xxxxxxx";
google_ad_width = 250;
google_ad_height = 250;
//-->
</script>
<script type="text/javascript"
src="http://pagead2.googlesyndication.com/pagead/show_ads.js">
</script>`

YouTube视频以250x250显示的百分比为100％。查看视图源，Youtube iframe现在有一个附加了250x250指令的样式元素。

`<iframe id="player" type="text/html" width="640" height="390" src="http://www.youtube.com/embed/GxTl1Ykbuww?enablejsapi=1&amp;origin=origin-domain.com" frameborder="0" style="width: 250px; height: 250px;"></iframe>`

如果移除了adsense代码，则会以正确的大小加载YouTube视频。

请帮助，5天后我认为这与CORS有关，但网上没有任何关于此问题的信息。不知怎的，adsense可以克服跨域限制并注入自己的iftube iframe。

Answer 1

问题与jquery有关，jquery是美化iframe主题的一部分

var win = jQuery(window),
 iframes = jQuery('iframe:not(.slideshow iframe):not( iframe.no_resize)',container),
 adjust_iframes = function() {
    iframes.each(function() {
        var iframe = jQuery(this),frame_parent_w = iframe.parent().width(),proportions = 16/9;
        if(this.width && this.height) {
            proportions = Math.round(this.width / this.height * 1000) / 1000;
            iframes.css({
                width:frame_parent_w,height: frame_parent_w / proportions});
        }
    });
};
adjust_iframes();
win.smartresize(adjust_iframes);

我添加：not（内部iframe）到第二行（因为Adsense总是将iframe包装在内部标记中，所有内容都按照预期呈现，上面的代码忽略了Adsense iframe设置。

来自Adsense的iframe（250x250）自动调整同一页面上的Youtube iframe为250x250

1 个答案: