code_junkie

How to apply CSS to iFrame?

Nov 11th, 2011
233
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 2.04 KB | None | 0 0
  1. <iframe name='iframe1' id="iframe1" src="empty.htm" frameborder="0" border="0" cellspacing="0" style="border-style: none;width: 100%; height: 120px;"></iframe>
  2.  
  3. <link type="text/css" rel="Stylesheet" href="Style/simple.css" />
  4.  
  5. var cssLink = document.createElement("link")
  6. cssLink.href = "style.css";
  7. cssLink .rel = "stylesheet";
  8. cssLink .type = "text/css";
  9. frames['frame1'].document.body.appendChild(cssLink);
  10.  
  11. var frm = frames['frame'].document;
  12. var otherhead = frm.getElementsByTagName("head")[0];
  13. var link = frm.createElement("link");
  14. link.setAttribute("rel", "stylesheet");
  15. link.setAttribute("type", "text/css");
  16. link.setAttribute("href", "style.css");
  17. otherhead.appendChild(link);
  18.  
  19. var cssLink = document.createElement("link")
  20. cssLink.href = "pFstylesEditor.css";
  21. cssLink .rel = "stylesheet";
  22. cssLink .type = "text/css";
  23.  
  24. //Instead of this
  25. //frames['frame1'].document.body.appendChild(cssLink);
  26. //Do this
  27.  
  28. var doc=document.getElementById("edit").contentWindow.document
  29.  
  30. ///If you are doing any dynamic writing do that first
  31. doc.open;
  32. doc.write(myData);
  33. doc.close();
  34.  
  35. //Then append child
  36. doc.body.appendChild(cssLink);
  37.  
  38. var iframe = top.frames[name].document;
  39. var css = '' +
  40. '<style type="text/css">' +
  41. 'body{margin:0;padding:0;background:transparent}' +
  42. '</style>';
  43. iframe.open();
  44. iframe.write(css);
  45. iframe.close();
  46.  
  47. <html>
  48. <header>
  49. <script src="/js/jquery.js" type="text/javascript">
  50. </header>
  51. <body>
  52. <div id='include-from-outside'></div>
  53. <script type='text/javascript'>
  54. $('#include-from-outside').load('http://example.com/included.html');
  55. </script>
  56. </body>
  57. </html>
  58.  
  59. doc.open();
  60.  
  61. doc.write('<!DOCTYPE html><html><head><meta charset="utf-8"/><meta http-quiv="Content-Type" content="text/html; charset=utf-8"/><title>Print Frame</title><link rel="stylesheet" type="text/css" href="/css/print.css"/></head><body><table id="' + gridId + 'Printable' + '" class="print" >' + out + '</table></body></html>');
  62.  
  63. doc.close();
Add Comment
Please, Sign In to add comment