SHARE
TWEET

index

a guest Oct 21st, 2017 77 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <html>
  2.    
  3.     <head>
  4.         <script src="js/jquery.min.js"></script>
  5.     </head>
  6.    
  7.     <style>
  8.         table,
  9.         td {
  10.             border: 2px solid black;
  11.         }
  12.    
  13.         td {
  14.             width: 17vw;
  15.             height: 17vw;
  16.         }
  17.    
  18.         .red {
  19.             background-color: red;
  20.         }
  21.    
  22.         h1 {
  23.             font-size: 10vw;
  24.             text-align: center;
  25.         }
  26.    
  27.         img {
  28.             height: 10vw;
  29.             width: auto;
  30.         }
  31.    
  32.         text {
  33.             font-size: 10vw;
  34.         }
  35.    
  36.         .noborder {
  37.             border: none;
  38.         }
  39.     </style>
  40.    
  41.     <body>
  42.         <h1>Clicker Game</h1>
  43.         <center>
  44.             <table class="noborder">
  45.                 <tr>
  46.                     <td class="noborder">
  47.                         <img src="heart.jpg">
  48.                     </td>
  49.                     <td class="noborder">
  50.                         <text id="healthText">3</text>
  51.                     </td>
  52.                     <td class="noborder">
  53.                         <img src="score.png">
  54.                     </td>
  55.                     <td class="noborder">
  56.                         <text id="scoreText">0</text>
  57.                     </td>
  58.                 </tr>
  59.             </table>
  60.             <table>
  61.                 <tr>
  62.                     <td id="11"></td>
  63.                     <td id="12"></td>
  64.                     <td id="13"></td>
  65.                     <td id="14"></td>
  66.                     <td id="15"></td>
  67.                 </tr>
  68.                 <tr>
  69.                     <td id="21"></td>
  70.                     <td id="22"></td>
  71.                     <td id="23"></td>
  72.                     <td id="24"></td>
  73.                     <td id="25"></td>
  74.                 </tr>
  75.                 <tr>
  76.                     <td id="31"></td>
  77.                     <td id="32"></td>
  78.                     <td id="33"></td>
  79.                     <td id="34"></td>
  80.                     <td id="35"></td>
  81.                 </tr>
  82.                 <tr>
  83.                     <td id="41"></td>
  84.                     <td id="42"></td>
  85.                     <td id="43"></td>
  86.                     <td id="44"></td>
  87.                     <td id="45"></td>
  88.                 </tr>
  89.                 <tr>
  90.                     <td id="51"></td>
  91.                     <td id="52"></td>
  92.                     <td id="53"></td>
  93.                     <td id="54"></td>
  94.                     <td id="55"></td>
  95.                 </tr>
  96.             </table>
  97.         </center>
  98.     </body>
  99.    
  100.     <script>
  101.  
  102.         let health = 3;
  103.         let score = 0;
  104.  
  105.         let redSquareId = "";
  106.  
  107.         $("td").click(function(){
  108.             if(this.id == redSquareId){
  109.                 score += 1;
  110.                 $("#scoreText").text(score);
  111.             }else{
  112.                 health -= 1;
  113.                 $("#healthText").text(health);
  114.             }
  115.             console.log("Vajutatud: " + this.id);
  116.             console.log("Score: " + score);
  117.         });
  118.  
  119.  
  120.         function getRandomNumber() {
  121.             return Math.floor(Math.random() * 5) + 1;
  122.         }
  123.    
  124.         function getRandomSquare() {
  125.             let y = getRandomNumber().toString();
  126.             let x = getRandomNumber().toString();
  127.             return y + x;
  128.         }
  129.    
  130.         function makeRedSquare() {
  131.             $("td").removeClass("red");
  132.             let id = getRandomSquare();
  133.             redSquareId = id;
  134.             $("#" + id).addClass("red");
  135.         }
  136.    
  137.    
  138.         setInterval(makeRedSquare, 3000);
  139.    
  140.    
  141.     </script>
  142.    
  143.     </html>
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
Top