Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

jquery inserting all stylesheets into iframe

How can I insert all of a parent window's stylesheets into an iframe's head(samedomain)?

My attempted code based on a similar question:

function () {
    var d = frames[0].document;
    var stylesheets = $("link").outerhtml;
    d.open();
    d.write(
    '<html><head>'+
    stylesheets + 
    '<style type="text/css">'+
    '<\/style><\/head><body><\/body><\/html>'
    );
    d.close();
}

Clearly this does not work outside of IE. Thanks in advance.

Edit: Attempt based on Anthony's answer:

    $("link[type='text/css']").each(function() {
        var stylesheet = $(this).clone();                                    
        $("iframe").contents().find("head").append(stylesheet);
    });
like image 574
Mark Avatar asked Sep 29 '09 02:09

Mark


1 Answers

An issue with the selected answer is that it uses .html(), which returns only the inner html contents of that element, not the element itself. Here is a working solution:

$("link[type='text/css']").clone().appendTo($("iframe").contents().find("head"));
like image 62
Peter DeWeese Avatar answered Oct 24 '22 08:10

Peter DeWeese