OLD | NEW |
| (Empty) |
1 <!doctype html> | |
2 <html lang="en"> | |
3 <head> | |
4 <style> | |
5 p, div { | |
6 font: 12px/1 monospace; | |
7 } | |
8 .box { | |
9 width: 260px; | |
10 height: 120px; | |
11 padding: 5px; | |
12 margin: 10px; | |
13 } | |
14 | |
15 #region1 { | |
16 -webkit-flow-from: flow1; | |
17 width: 300px; | |
18 height: 190px; | |
19 border: 5px solid green; | |
20 background-color: #ddddff; | |
21 margin-bottom: 20px; | |
22 } | |
23 | |
24 #region2 { | |
25 -webkit-flow-from: flow2; | |
26 width: 300px; | |
27 height: 190px; | |
28 border: 5px solid darkred; | |
29 background-color: #ddddff; | |
30 position: relative; | |
31 left: 350px; | |
32 top: -220px; | |
33 } | |
34 | |
35 #content { | |
36 -webkit-flow-into: flow1; | |
37 border: 5px solid blue; | |
38 background: #aaaacc;; | |
39 } | |
40 #content:hover { | |
41 -webkit-flow-into: flow2; | |
42 } | |
43 </style> | |
44 </head> | |
45 | |
46 <script type="text/javascript"> | |
47 if (window.testRunner) | |
48 testRunner.waitUntilDone(); | |
49 | |
50 function beginTest() { | |
51 if (window.eventSender) { | |
52 var content = document.querySelector("#content"); | |
53 | |
54 // move mouse on the hover test object | |
55 eventSender.mouseMoveTo(content.offsetLeft + 20, content
.offsetTop + 20); | |
56 | |
57 testRunner.notifyDone(); | |
58 } | |
59 } | |
60 </script> | |
61 | |
62 <script type="text/javascript"> | |
63 function elementHovered() { | |
64 if (window.testRunner) | |
65 document.getElementById("content").style.webkitFlowInto
= "flow2"; | |
66 } | |
67 </script> | |
68 | |
69 | |
70 <body onload="beginTest()"> | |
71 <p>When hovering the <span style="color:blue"><b>blue box</b></span>, it
should move to the <span style="color:darkred"><b>second region</b></span> (it'
s <b>flow-into</b> will change to the 2nd thread)</p> | |
72 <div id="region1"></div> | |
73 <div id="region2"></div> | |
74 <div id="content" class="box" onmouseover="elementHovered()">This box is
flowed into the <span style="color:green"><b>first region</b></span> when it is
<b>not</b> hovered and into the <span style="color:darkred"><b>second region</b
></span> when it <b>is</b></div> | |
75 </body> | |
76 </html> | |
OLD | NEW |