Advertisement
theultraman20

game.html

Dec 30th, 2024
93
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 7.00 KB | None | 0 0
  1.  
  2. <html>
  3. <head>
  4. <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
  5. <script>
  6. $(document).ready(function(){
  7. $('audio').trigger('play');
  8. debounce = false;
  9. ra = true;
  10.  
  11.  
  12. setInterval(function() {
  13. $('.obstacles').css('border-color', 'rgb(0, ' + (Math.floor(Math.random(180, 255)*200 /*end floor*/)).toString() + ', ' + (Math.floor(Math.random(200, 255)*200 /*end floor*/)).toString() + ')')
  14. }, 1000);
  15.  
  16. $(document).keypress(function(evt) {
  17. //start touch trigger--------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------
  18. if ($('#div').offset().left > ($('#block2').offset().left - 110) && $('#div').offset().left < ($('#block2').offset().left + 130) && $('#div').offset().top > ($('#block2').offset().top - 110) && $('#div').offset().top < ($('#block2').offset().top + 130)) {
  19. $('#div').offset({top: 0, left: 0})
  20.  
  21. };
  22. if ($('#div').offset().left > ($('#block4').offset().left - 110) && $('#div').offset().left < ($('#block4').offset().left + 130) && $('#div').offset().top > ($('#block4').offset().top - 110) && $('#div').offset().top < ($('#block4').offset().top + 130)) {
  23. $('#div').offset({top: 0, left: 0})
  24.  
  25. };
  26.  
  27. if ($('#div').offset().left > ($('#block3').offset().left - 110) && $('#div').offset().left < ($('#block3').offset().left + 130) && $('#div').offset().top > ($('#block3').offset().top - 110) && $('#div').offset().top < ($('#block3').offset().top + 130)) {
  28. $('#div').offset({top: 0, left: 0})
  29.  
  30. };
  31.  
  32. if ($('#div').offset().left > ($('#block').offset().left - 110) && $('#div').offset().left < ($('#block').offset().left + 130) && $('#div').offset().top > ($('#block').offset().top - 110) && $('#div').offset().top < ($('#block').offset().top + 130)) {
  33. $('#div').offset({top: 0, left: 0})
  34. };
  35.  
  36. if ($('#div').offset().left > ($('#block6').offset().left - 110) && $('#div').offset().left < ($('#block6').offset().left + 130) && $('#div').offset().top > ($('#block6').offset().top - 110) && $('#div').offset().top < ($('#block6').offset().top + 130)) {
  37. $('#div').offset({top: 0, left: 0})
  38. };
  39.  
  40.  
  41. setInterval(function() {
  42. if ($('#div').offset().left > ($('#block5').offset().left - 110) && $('#div').offset().left < ($('#block5').offset().left + 130) && $('#div').offset().top > ($('#block5').offset().top - 110) && $('#div').offset().top < ($('#block5').offset().top + 130)) {
  43. $('#div').offset({top: 0, left: 0})
  44. };
  45. }, 1000);
  46.  
  47. //end touch trigger and start key trigger--------------------------------------------------------------------------------------------------------------------------------------------------------
  48.  
  49.    if (String.fromCharCode(evt.which) == "d") {
  50. $("#div").animate({
  51. left: "+=10"
  52. }, 20);
  53. //start thing
  54. };
  55. if (String.fromCharCode(evt.which) == "a" && $('#div').offset().left > 0){
  56. $("#div").animate({
  57. left: "-=10"
  58. }, 20);
  59. };
  60. if ($('#div').offset().left < 0 ){
  61. $('#div').animate({
  62. left: '0'
  63. }, 'swing').stop()
  64. };
  65. if (String.fromCharCode(evt.which) == "s" && $('#div').offset().top < 820) {
  66. $("#div").animate({
  67. top: "+=10"
  68. }, 10);
  69. };
  70. if (String.fromCharCode(evt.which) == "w") {
  71. $("#div").animate({
  72. top: "-=10"
  73. }, 10);
  74. };
  75.  
  76. if (String.fromCharCode(evt.which) == "g" && prompt('enter the password to get acess to this content', 'the password ISNT edmodoRocks').toString() == 'edmodoRocks') {
  77. alert('left coordinates: ' + $('#div').offset().left + ', top coordinates: ' + $('#div').offset().top)
  78. };
  79.  
  80. if (String.fromCharCode(evt.which) == " ") {
  81. $("#div").animate({
  82. top: "-=100"
  83. }, 400).animate({
  84. top: "+=100"
  85. }, 400);
  86. };
  87. if (debounce == false) {
  88. $("h3").slideUp(2000);
  89. debounce = true;
  90. };
  91. //end key trigger------------------------------------------------------------------------------------------------------------------------------------------------------------------------
  92.  });
  93.  
  94. $("#div").dblclick(function() {
  95. $("#div").animate({
  96. top: "-=300",
  97. left: "+=400"
  98. }, 2000).animate({
  99. top: "+=300"
  100. }, 500);
  101. });
  102.  
  103. //moving obstacles---------------------------------------------------------------------------------------------------------------------------------------------------------------------
  104. ///start
  105.  
  106. setInterval(function() {
  107. $('#block5').animate({
  108. left: '+=200',
  109. top: '-=200'
  110. }, 1500);
  111. setTimeout(function() {
  112. $('#block5').animate({
  113. left: '-=200',
  114. top: '+=200'
  115. }, 1500);
  116. }, 2000);
  117. }, 2000);
  118. //end
  119.  
  120.  
  121. });
  122. /*end jquery script......*/
  123. </script>
  124. </head>
  125. <body>
  126.  
  127. <h2 stye = "text-align: center;">Welcome to my game!</h2>
  128.  
  129. <h3>click any button to start</h3>
  130. <h5>use the w, s, a, d, and space keys to operate your character</h5>
  131. <h2><strong>don't</strong> hit the blocks!</h2>
  132.  
  133. <div id = "div" style="height:100px;width:100px;position:absolute;">
  134. <img src = "https://encrypted-tbn3.gstatic.com/images?q=tbn:ANd9GcS3YFILtpAEZ3mdhMl-N-EU0jFna90Hbpu_lpS23idcSaVgjWSF" style = "height: 100px; width: 100px;border-radius: 0px;" /></div>
  135. <!--obstacles-->
  136. <div  class = 'obstacles' id = "block2" style="height:100px;width:100px;position:absolute;background: #FF6666; top: 300px; left: 250px;border: 10px solid blue">
  137. </div>
  138.  
  139. <div class = 'obstacles' id = "block" style="height:100px;width:100px;position:absolute;background: #FF6666; top: 100px; left: 400px;border: 10px solid blue">
  140. </div>
  141.  
  142. <div class = 'obstacles' id = "block3" style="height:100px;width:100px;position:absolute;background: #FF6666; top: 600px; left: 450px;border: 10px solid blue">
  143. </div>
  144.  
  145. <div class = 'obstacles' id = "block4" style="height:100px;width:100px;position:absolute;background: #ff6666; top: 800px; left: 150px;border: 10px solid blue">
  146. </div>
  147.  
  148. <div class = 'obstacles' id = "block6" style="height:100px;width:100px;position:absolute;background: #ff6666; top: 710px; left: 200px;border: 10px solid blue">
  149. </div>
  150.  
  151. <div class = 'obstacles' id = "block5" style="height:100px;width:100px;position:absolute;background: #ff6666; top: 700px; left: 500px;border: 10px solid blue">
  152. </div>
  153.  
  154. <audio>
  155.    <source src="file:///C:/Users/user/Downloads/KDrew%20-%20Bullseye.mp3" type="audio/mp3">
  156. </audio>
  157.  
  158. <span id = 'coords'>
  159. </span>
  160.  
  161.  
  162.  
  163.  
  164. </body>
  165. </html>
  166. class = 'obstacles' id = "block" style="height:100px;width:100px;position:absolute;background: #FF6666; top: 100px; left: 400px;border: 10px solid blue">
  167. </div>
  168.  
  169. <div class = 'obstacles' id = "block3" style="height:100px;width:100px;position:absolute;background: #FF6666; top: 600px; left: 450px;border: 10px solid blue">
  170. </div>
  171.  
  172. <div class = 'obstacles' id = "block4" style="height:100px;width:100px;position:absolute;background: #ff6666; top: 800px; left: 150px;border: 10px solid blue">
  173. </div>
  174.  
  175. <div class = 'obstacles' id = "block6" style="height:100px;width:100px;position:absolute;background: #ff6666; top: 710px; left: 200px;border: 10px solid blue">
  176. </div>
  177.  
  178. <div class = 'obstacles' id = "block5" style="height:100px;width:100px;position:absolute;background: #ff6666; top: 700px; left: 500px;border: 10px solid blue">
  179. </div>
  180.  
  181. <audio>
  182.    
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement