在2.1.4的fancybox iframe的透明背景 [英] Iframe transparent background on Fancybox 2.1.4

问题描述

按标题，添加以下取消对2.1.4的fancybox后台运行的Safari浏览器，FF＆安培以下的罚款; Chrome，但不是IE的。 （仅在IE8测试）

  beforeShow：功能（）{
    //透明背景
    $（的fancybox皮）的CSS（背景，透明）。    //删除阴影效果
    $（的fancybox皮肤。）的CSS（ -  WebKit的箱阴影，0 0 0 RGBA（0，0，0，0））;
    $（的fancybox皮肤。）的CSS（ -  MOZ-箱阴影，0 0 0 RGBA（0，0，0，0））;
    $（的fancybox皮肤。）的CSS（箱阴影，0 0 0 RGBA（0，0，0，0））;
}
 

解决方案

周围的fancybox的src文件挖掘后，问题出在IFRAMEALLOWTRANSPARENCY属性。

在jquery.fancybox.js线140，下面将行：

  IFRAME：'＆LT; IFRAME ID =的fancybox帧{RND}NAME =的fancybox帧{RND}级=的fancybox的iframeFRAMEBORDER =0 VSPACE =0HSPACE =0webkitAllowFullScreen mozallowfullscreen的allowFullScreen ALLOWTRANSPARENCY =真＆GT;＆下; / iframe中与GT;'，
 

As per title, adding the below to remove background on Fancybox 2.1.4 works fine on Safari, FF & Chrome but not IEs. (only tested on IE8)

beforeShow: function(){
    //transparent background
    $(".fancybox-skin").css("background","transparent");

    //remove dropshadow
    $(".fancybox-skin").css("-webkit-box-shadow","0 0 0 rgba(0, 0, 0, 0)");
    $(".fancybox-skin").css("-moz-box-shadow","0 0 0 rgba(0, 0, 0, 0)");
    $(".fancybox-skin").css("box-shadow","0 0 0 rgba(0, 0, 0, 0)");
}

解决方案

After digging around the Fancybox's src files, the problem is at the iframe "allowtransparency" attribute.

In jquery.fancybox.js line 140, replace the line with below:

iframe   : '<iframe id="fancybox-frame{rnd}" name="fancybox-frame{rnd}" class="fancybox-iframe" frameborder="0" vspace="0" hspace="0" webkitAllowFullScreen mozallowfullscreen allowFullScreen allowtransparency="true"></iframe>',

这篇关于在2.1.4的fancybox iframe的透明背景的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！