| <html> |
| <head> |
| <style type="text/css"> |
| #draggable { |
| padding: 5pt; |
| border: 3px solid #00cc00; |
| background: #00cccc; |
| width: 80px; |
| cursor: hand; |
| } |
| |
| #scrollable { |
| height: 200px; |
| overflow: auto; |
| border: solid 3px #cc0000; |
| font-size: 80px; |
| } |
| </style> |
| <script> |
| function $(id) { return document.getElementById(id); } |
| var MIDDLE_BUTTON = 1; |
| var PAN_SCROLL_RADIUS = 15; // from FrameView::noPanScrollRadius |
| |
| function setUpTest() |
| { |
| var scrollable = $('scrollable'); |
| for (var i = 0; i < 10; ++i) { |
| var line = document.createElement('div'); |
| line.innerHTML = "line " + i; |
| scrollable.appendChild(line); |
| } |
| |
| if (!window.eventSender) |
| return; |
| |
| // Start pan scroll by click |
| eventSender.mouseMoveTo(scrollable.offsetLeft + 5, scrollable.offsetTop + 5); |
| eventSender.mouseDown(MIDDLE_BUTTON); |
| eventSender.mouseUp(MIDDLE_BUTTON); |
| |
| // Stop pan scroll by click |
| eventSender.mouseDown(MIDDLE_BUTTON); |
| eventSender.mouseUp(MIDDLE_BUTTON); |
| } |
| </script> |
| </head> |
| <body> |
| You should run this test in DRT. |
| <br> |
| For manual testing, hold middle button in scrollable and move aroudn mouse pointer for scrolling, then release middle button to stop scrolling. |
| You won't see pan icon after pan scroll. |
| <div id="container"> |
| Scrollable |
| <div id="scrollable"> |
| </div> |
| </div> |
| <script> |
| setUpTest(); |
| </script> |
| </body> |
| </html> |
