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> 10Following 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> 13A 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> 16Colored 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> 46