javascript - Move the whole document into an iframe -
what i'm trying wrap complete website in iframe without breaking styling or javascript.
this i've tried:
var $frame = $('<iframe />').css({ position: 'fixed', top: 0, left: 0, width: '100%', height: '100%' }).appendto('body'); $('head').children().appendto($frame.contents().find('head')); $('body').children().not($frame).appendto($frame.contents().find('body')); see http://jsfiddle.net/gujwu/3/
this works fine in chrome.
firefox seems swallow whole page.
internet explorer (see http://jsfiddle.net/gujwu/3/show/) create iframe, doesn't move it.
does approach have chance of working cross-browser?
in ie, document isn't inferred , automatically created, need create before accessing it:
var $frame = $('<iframe />').css({ position: 'fixed', top: 0, left: 0, width: '100%', height: '100%' }).appendto('body'); var doc = $frame[0].contentdocument || $frame[0].contentwindow.document; doc.open(); doc.write("<!doctype html><html><head><title></title></head><body></body></html>"); doc.close(); $('head').children().appendto($frame.contents().find('head')); $('body').children().not($frame).appendto($frame.contents().find('body')); demo: http://jsfiddle.net/xamtc/show/
this seems work in ie8/9, , recent firefox , chrome, @ least.
the way figured out problem console.logging $frame.contents().find('head').length, 0 in ie.
Comments
Post a Comment