|
1 <!DOCTYPE HTML> |
|
2 <title>getComputedStyle across windows</title> |
|
3 <style> |
|
4 p { color: blue } |
|
5 |
|
6 div { margin: 1em 0 } |
|
7 </style> |
|
8 |
|
9 <script> |
|
10 |
|
11 var gRunCount = 2; |
|
12 |
|
13 function run() { |
|
14 if (--gRunCount != 0) |
|
15 return; |
|
16 |
|
17 var i = document.getElementById("i"); |
|
18 |
|
19 var pout = document.getElementById("out"); |
|
20 var poutnone = document.getElementById("outnone"); |
|
21 var poutdet = document.createElement("p"); |
|
22 var pin = i.contentDocument.getElementsByTagName("p")[0]; |
|
23 var pinnone = i.contentDocument.getElementsByTagName("p")[1]; |
|
24 var pindet = i.contentDocument.createElement("p"); |
|
25 |
|
26 document.getElementById("res1").style.color = |
|
27 window.getComputedStyle(pin, "").color; |
|
28 |
|
29 document.getElementById("res2").style.color = |
|
30 i.contentWindow.getComputedStyle(pout, "").color; |
|
31 |
|
32 document.getElementById("res3").style.color = |
|
33 window.getComputedStyle(pinnone, "").color; |
|
34 |
|
35 document.getElementById("res4").style.color = |
|
36 i.contentWindow.getComputedStyle(poutnone, "").color; |
|
37 |
|
38 document.getElementById("res5").style.color = |
|
39 window.getComputedStyle(pindet, "").color; |
|
40 |
|
41 document.getElementById("res6").style.color = |
|
42 i.contentWindow.getComputedStyle(poutdet, "").color; |
|
43 } |
|
44 |
|
45 </script> |
|
46 <body onload="run()"> |
|
47 |
|
48 <p id="out">This is a paragraph outside the iframe.</p> |
|
49 <div style="display:none"><p id="outnone">This is a paragraph outside the iframe.</p></div> |
|
50 |
|
51 <iframe id="i" src="computed-style-cross-window-inner.html" onload="run()"></iframe> |
|
52 |
|
53 <div style="color:fuchsia">This paragraph is the color that |
|
54 outerWindow.getComputedStyle says the paragraph inside the iframe |
|
55 is.</div> |
|
56 |
|
57 <div style="color:blue">This paragraph is the color that |
|
58 iframeWindow.getComputedStyle says the paragraph outside the iframe |
|
59 is.</div> |
|
60 |
|
61 <div style="color:fuchsia">This paragraph is the color that |
|
62 outerWindow.getComputedStyle says the display:none paragraph inside the |
|
63 iframe is.</div> |
|
64 |
|
65 <div style="color:blue">This paragraph is the color that |
|
66 iframeWindow.getComputedStyle says the display:none paragraph outside |
|
67 the iframe is.</div> |
|
68 |
|
69 <div style="color:blue">This paragraph is the color that |
|
70 outerWindow.getComputedStyle says the detached paragraph inside the |
|
71 iframe is.</div> |
|
72 |
|
73 <div style="color:fuchsia">This paragraph is the color that |
|
74 iframeWindow.getComputedStyle says the detached paragraph outside |
|
75 the iframe is.</div> |