browser/devtools/responsivedesign/test/touch.html@6474c204b198 (annotated)
browser/devtools/responsivedesign/test/touch.html
Wed, 31 Dec 2014 06:09:35 +0100
- author
- Michael Schloh von Bennewitz <michael@schloh.com>
- date
- Wed, 31 Dec 2014 06:09:35 +0100
- changeset 0
- 6474c204b198
- permissions
- -rw-r--r--
Cloned upstream origin tor-browser at tor-browser-31.3.0esr-4.5-1-build1
revision ID fc1c9ff7c1b2defdbc039f12214767608f46423f for hacking purpose.
| michael@0 | 1 | <!DOCTYPE html> |
| michael@0 | 2 | |
| michael@0 | 3 | <meta charset=utf-8 /> |
| michael@0 | 4 | <title>test</title> |
| michael@0 | 5 | |
| michael@0 | 6 | |
| michael@0 | 7 | <style> |
| michael@0 | 8 | div { |
| michael@0 | 9 | border:1px solid red; |
| michael@0 | 10 | width: 100px; height: 100px; |
| michael@0 | 11 | } |
| michael@0 | 12 | </style> |
| michael@0 | 13 | |
| michael@0 | 14 | <div></div> |
| michael@0 | 15 | |
| michael@0 | 16 | <script> |
| michael@0 | 17 | var div = document.querySelector("div"); |
| michael@0 | 18 | var initX, initY; |
| michael@0 | 19 | |
| michael@0 | 20 | |
| michael@0 | 21 | div.addEventListener("touchstart", function(evt) { |
| michael@0 | 22 | var touch = evt.changedTouches[0]; |
| michael@0 | 23 | initX = touch.pageX; |
| michael@0 | 24 | initY = touch.pageY; |
| michael@0 | 25 | }, true); |
| michael@0 | 26 | |
| michael@0 | 27 | div.addEventListener("touchmove", function(evt) { |
| michael@0 | 28 | var touch = evt.changedTouches[0]; |
| michael@0 | 29 | var deltaX = touch.pageX - initX; |
| michael@0 | 30 | var deltaY = touch.pageY - initY; |
| michael@0 | 31 | div.style.transform = "translate(" + deltaX + "px, " + deltaY + "px)"; |
| michael@0 | 32 | }, true); |
| michael@0 | 33 | |
| michael@0 | 34 | div.addEventListener("touchend", function(evt) { |
| michael@0 | 35 | div.style.transform = "none"; |
| michael@0 | 36 | }, true); |
| michael@0 | 37 | </script> |
