touch.html 1.4 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546
  1. <script>
  2. $(document).ready(function(){
  3. $("#taptest").bind("tap",function(){
  4. alert("I was tapped");
  5. })
  6. $("#singletaptest").bind("singleTap",function(){
  7. alert("I was single tapped");
  8. })
  9. $("#longtaptest").bind("longTap",function(){
  10. alert("I was a long tap");
  11. })
  12. $("#doubletaptest").bind("doubleTap",function(){
  13. alert("I was a double tap");
  14. })
  15. $("#swipetest").bind("swipe",function(){
  16. alert("I was a swiped");
  17. });
  18. });
  19. function showMoreSheet(){
  20. $.afui.actionsheet(
  21. [{
  22. text: 'Stuff',
  23. cssClasses: ''
  24. }]);
  25. }
  26. </script>
  27. <h2>Touch Events</h2>
  28. <a class='button' href='#main' data-transition='up-reveal:dismiss'>Back</a>
  29. <ul class="list">
  30. <li><a id='taptest' >Tap <br>Test</a></li>
  31. <li><a id='longtaptest' >Long Tap Test</a></li>
  32. <li><a id='singletaptest' >Single Tap Test</a></li>
  33. <li><a id='doubletaptest' >Double Tap Test</a></li>
  34. <li class="swipe-x swipe-y"><a id='swipetest' >Swipe Test</a></li>
  35. <li class="swipe-reveal">
  36. <div class="swipe-content">Swipe to reveal options </div>
  37. <div class="swipe-hidden">
  38. <a class="button more" onclick="showMoreSheet()">More</a>
  39. <a class="button archive" onclick="$(this).closest('.swipe-reveal').remove()">Archive</a>
  40. </div>
  41. </li>
  42. </ul>
  43. </div>