The Tor Browser / file comparison
comparison: browser/devtools/responsivedesign/test/touch.html
browser/devtools/responsivedesign/test/touch.html
- changeset 0
- 6474c204b198
equal
deleted
inserted
replaced
| -1:000000000000 | 0:59c64baae415 |
|---|---|
| 1 <!DOCTYPE html> | |
| 2 | |
| 3 <meta charset=utf-8 /> | |
| 4 <title>test</title> | |
| 5 | |
| 6 | |
| 7 <style> | |
| 8 div { | |
| 9 border:1px solid red; | |
| 10 width: 100px; height: 100px; | |
| 11 } | |
| 12 </style> | |
| 13 | |
| 14 <div></div> | |
| 15 | |
| 16 <script> | |
| 17 var div = document.querySelector("div"); | |
| 18 var initX, initY; | |
| 19 | |
| 20 | |
| 21 div.addEventListener("touchstart", function(evt) { | |
| 22 var touch = evt.changedTouches[0]; | |
| 23 initX = touch.pageX; | |
| 24 initY = touch.pageY; | |
| 25 }, true); | |
| 26 | |
| 27 div.addEventListener("touchmove", function(evt) { | |
| 28 var touch = evt.changedTouches[0]; | |
| 29 var deltaX = touch.pageX - initX; | |
| 30 var deltaY = touch.pageY - initY; | |
| 31 div.style.transform = "translate(" + deltaX + "px, " + deltaY + "px)"; | |
| 32 }, true); | |
| 33 | |
| 34 div.addEventListener("touchend", function(evt) { | |
| 35 div.style.transform = "none"; | |
| 36 }, true); | |
| 37 </script> |
