| 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152 |
- <!DOCTYPE html>
- <html>
- <head>
- <meta charset="UTF-8" />
- <meta name="viewport" content="initial-scale=1.0, width=device-width, user-scalable=no" />
- <meta name="apple-mobile-web-app-capable" content="yes" />
- <title>Shake.js</title>
- <style type="text/css">
- body {
- background: #E9E9E9;
- color: #333;
- font: 1em/1.3em "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif; /* 16px / 21px */
- text-shadow: rgba(255,255,255,0.8) 0 1px 0;
- text-align: center;
- }
- </style>
- <script type="text/javascript" src="shake.js"></script>
- </head>
- <body>
- <h1>Shake to Undo</h1>
- <h2>for your mobile web app</h2>
- <p>Shake your iPhone/iPad to see a custom action.</p>
- <p>Works on iOS +4.2.1, Android 4.0.3 (default browser), Opera Mobile (Android), BlackBerry PlayBook 2.0</p>
- <p><a href="http://dev.w3.org/geo/api/spec-source-orientation">W3C DeviceOrientation Event Specification</a></p>
- <script type="text/javascript">
- window.onload = function() {
- //create a new instance of shake.js.
- var myShakeEvent = new Shake({
- threshold: 15
- });
- // start listening to device motion
- myShakeEvent.start();
- // register a shake event
- window.addEventListener('shake', shakeEventDidOccur, false);
- //shake event callback
- function shakeEventDidOccur () {
- //put your own code here etc.
- alert('Shake!');
- }
- };
- </script>
- </body>
- </html>
|
