1

iframe(fancybox)の先頭に要素を追加したい

奇妙な問題があります: 要素を Head に追加するコード行のブレークポイントに Firefox を使用すると、正常に動作しますが、firebug なしで通常どおりサイトを実行すると動作しません。

私は fancybox 1.3.4 を使用しており、コードは onComplete イベントで実行されます

var cssLink = document.createElement("link") 
cssLink.href = "/themes/furniture/css/test.css"; 
cssLink .rel = "stylesheet"; 
cssLink .type = "text/css"; 


var f123= document.getElementById('fancybox-frame');

var d123= f123.contentDocument || f123.contentWindow.document;

d123.head.appendChild(cssLink);

アップデート

私もこのコードを試します

var $head = $("#fancybox-frame").contents().find("head");                
$head.append($("<link/>", 
{ rel: "stylesheet", href: "/themes/furniture/css/test.css", type: "text/css" } ));

しかし、それも機能しません

TNX

4

1 に答える 1

1

まあ、それは確かに（彼のコメントでolsnが指摘したように）iframeのロードとその中の要素の検索の間の競合状態のようです.2番目が最初に発生すると失敗します;）

回避策として、メソッドを使用して が完全にロードされる.load()のを待ってから、スタイルシートをセクションに追加することができます。iframeappend<head>

このコードはトリックを行う必要があります:

$(document).ready(function () {
    $(".fancybox").fancybox({
        "type": "iframe",
        "onComplete": function () {
            var $style = '<link rel="stylesheet" href="/themes/furniture/css/test.css" type="text/css" />';
            $("#fancybox-frame").load(function () {
                $(this).contents().find("head").append($style);
            });
        }
    });
});

注：これはfancybox v1.3.4用です。幸い、v2.x には v1.3.4 よりも柔軟なパブリック メソッドが含まれており、この問題を回避できますafterLoad。beforeShow

setTimeout()また、それも機能しますが、奇妙にレンダリングされることに注意してください。

于 2013-04-26T23:10:44.077 に答える