|
1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" |
|
2 "http://www.w3.org/TR/html4/strict.dtd"> |
|
3 <html lang="en"> |
|
4 <head> |
|
5 </head> |
|
6 <body> |
|
7 <p><b>BUG ID</b> <a href="rdar://problem/3471901">3471901</a> support scrollIntoView method for DOM elements (3474)</p> |
|
8 |
|
9 <p id="test" style="background-color:skyblue; padding:3px;"><b>STEPS TO TEST:</b> |
|
10 Following the numbered steps, click each button to scroll the specified colored box into view.</p> |
|
11 |
|
12 <p id="success" style="background-color:palegreen; padding:3px;"><b>TEST PASS:</b> |
|
13 A colored box should scroll into view after clicking each button. The text on the button specifies the expected position (top, bottom) of the box scrolled into view.</p> |
|
14 |
|
15 <p id="failure" style="background-color:#FF3300; padding:3px;"><b>TEST FAIL:</b> |
|
16 Colored box does not scroll into view, or the box is scrolled to the wrong positon (top, bottom). |
|
17 </p> |
|
18 |
|
19 <div id="purplebox" style="background-color:purple; width: 300px; height: 100px;"> |
|
20 <input type="button" value="STEP 1: click to scroll yellow box to BOTTOM of view" onclick="document.getElementById('yellowbox').scrollIntoView(false);"> |
|
21 <input type="button" value="STEP 4: click to scroll orange box to TOP of view" onclick="document.getElementById('orangebox').scrollIntoView(true);"> |
|
22 </div> |
|
23 |
|
24 <div style="height: 500px; width: 500px; border: 1px solid;">here is a big empty div</div> |
|
25 |
|
26 <div id="greenbox" style="background-color:green; width: 300px; height: 100px;"> |
|
27 <input type="button" value="STEP 3: click to scroll purple box to TOP of view" onclick="document.getElementById('purplebox').scrollIntoView();"> |
|
28 </div> |
|
29 |
|
30 <div style="height: 500px; width: 500px; border: 1px solid;">here is a big empty div</div> |
|
31 |
|
32 <div id="yellowbox" style="background-color:yellow; width: 300px; height: 100px;"> |
|
33 <input type="button" value="STEP 2: click to scroll green box to TOP of view" onclick="document.getElementById('greenbox').scrollIntoView(true);"> |
|
34 </div> |
|
35 |
|
36 <div style="height: 500px; width: 500px; border: 1px solid;">here is a big empty div</div> |
|
37 |
|
38 <div id="orangebox" style="background-color:orange; width: 300px; height: 100px;"> |
|
39 Test Complete |
|
40 </div> |
|
41 |
|
42 <div style="height: 500px; width: 500px; border: 1px solid;">here is a big empty div</div> |
|
43 |
|
44 </body> |
|
45 </html> |