index.html 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869
  1. <!doctype html>
  2. <html>
  3. <head><meta name="x-key" content="e56d2d6a4bfe26a4fbdd4e05dc9785fb">
  4. <meta charset="UTF-8">
  5. <title>亡命射箭</title>
  6. <meta name="viewport" content="width=device-width, initial-scale=1, minimum-scale=1, maximum-scale=1,user-scalable=0">
  7. <link rel="stylesheet" href="assets/css/main.css">
  8. </head>
  9. <body>
  10. <div class="grid" id="grid">
  11. <div class="page" id="index">
  12. <img class="logo" src="assets/img/logo.png" alt="亡命射箭">
  13. <img class="start" id="btn-start" src="assets/img/start.png">
  14. <img class="start" id="btn-more2" src="assets/img/more.png">
  15. <div style="clear:both"></div>
  16. <img class="copyright" src="assets/img/boyaa.png">
  17. </div>
  18. <div class="page" id="game">
  19. <div class="view-wrap">
  20. <div id="apple" class="apple"></div>
  21. <div id="score"></div>
  22. <div class="people"></div>
  23. <div class="bow"></div>
  24. <div class="arrow"></div>
  25. <div class="bar">
  26. <div class="progress">
  27. </div>
  28. <div class="barLifes">
  29. </div>
  30. </div>
  31. </div>
  32. <div id="control">
  33. </div>
  34. </div>
  35. <div class="page hide" id="gameover">
  36. <div class="info hide">
  37. </div>
  38. <div class="fail-one hide"></div>
  39. <div class="fail-two hide"></div>
  40. <div class="fail-three hide"></div>
  41. <div class="btn-wrap">
  42. <div class="btn" id="btn-restart"></div>
  43. <div class="btn" id="btn-share"></div>
  44. <div class="btn" id="btn-more"></div>
  45. </div>
  46. </div>
  47. <div class="page hide" id="jd"></div>
  48. </div>
  49. <!-- js files start -->
  50. <script src="assets/js/jquery.js"></script>
  51. <script src="assets/js/app.js"></script>
  52. <script>
  53. var maxWidth = 640, maxHeight = 960;
  54. var currWidth = document.body.clientWidth;
  55. var currHeight = document.body.clientHeight;
  56. var scale = Math.min(currWidth / maxWidth, currHeight / maxHeight); //固定比率 变尺寸
  57. $("#grid").css({
  58. "-webkit-transform": "scale(" + scale + "," + scale + ")",
  59. "-moz-transform": "scale(" + scale + "," + scale + ")",
  60. "transform": "scale(" + scale + "," + scale + ")"
  61. });
  62. </script>
  63. <script src="assets/js/bar.js"></script>
  64. </body>
  65. </html>