<!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>
Codebase Browser
chromium