Iframe transparent background on Fancybox 2.1.4

2019-08-29 20:25发布

问题:

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)");
}

回答1:

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>',