| <!DOCTYPE html> |
| <script src="../../resources/testharness.js"></script> |
| <script src="../../resources/testharnessreport.js"></script> |
| <script src="resources/drag-and-drop-autoscroll-frame.js"></script> |
| <style type="text/css"> |
| #draggable { |
| padding: 5pt; |
| border: 3px solid #00cc00; |
| background: #00cccc; |
| width: 80px; |
| cursor: pointer; |
| } |
| #scrollable { |
| height: 400px; |
| width: 400px; |
| overflow: auto; |
| font-size: 80px; |
| } |
| #container { |
| position: relative; |
| left: 2000px; |
| top: 2000px; |
| } |
| #sample { |
| width: 2000px; |
| height: 2000px; |
| } |
| body { |
| margin: 0; |
| } |
| </style> |
| For manual testing, drag and drop "Drop Me" to "Scrollable" area. |
| <div id="draggable" draggable="true">Drop Me</div> |
| <div id="scrollbars" style="overflow: scroll"><div>scrollbars</div></div> |
| Scrollable |
| <div id="scrollable"> |
| <div id="container"> |
| <table id="sample" border="1"> |
| <tr><td width="50%">North West</td><td width="50%">North East</td></tr> |
| <tr><td width="50%">South West</td><td width="50%">South East</td></tr> |
| </table> |
| </div> |
| </div> |