legatmichau

kliknij kurwa kwadrat

Dec 7th, 2018
121
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
HTML 2.18 KB | None | 0 0
  1. <!DOCTYPE html>
  2. <html>
  3.     <head>
  4.         <meta charset="utf-8">
  5.         <title>kliknij kurwa pole</title>
  6.         <style>
  7.             body{
  8.                 margin:0px;
  9.                 padding:0px;
  10.             }
  11.             #container{
  12.                 background-color:LightBlue;
  13.                 height:700px;
  14.                 width:1000px;
  15.                 padding:50px;
  16.                 border:3px solid black;
  17.                 border-radius:10px;
  18.                 margin-left:200px;
  19.                 margin-top:50px;
  20.                
  21.             }
  22.             #plansza{
  23.                 background-color:White;
  24.                 height:500px;
  25.                 border:3px solid black;
  26.                 width:500px;
  27.                 float:left;
  28.             }
  29.             #dodatkowe{
  30.                 float:right;
  31.             }
  32.             .pole{
  33.                 height:98px;
  34.                 width:98px;
  35.                 border:1px solid black;
  36.                 background-color:Blue;
  37.                 float:left;
  38.             }
  39.             #pole_dobre{
  40.                 background-color:Green;
  41.                 height:98px;
  42.                 width:98px;
  43.                 border:1px solid black;
  44.                 float:left;
  45.             }
  46.         </style>
  47.         <script>
  48.             var score=(-1);
  49.             function reset(){
  50.                 score=(-1);
  51.             }
  52.        
  53.             function wypelnij(){
  54.                 score++;
  55.                 var losowa = parseInt(Math.random() * 25);
  56.                 var content='';
  57.                
  58.                 for(k=0;k<25;k++){
  59.                
  60.                    if(k==losowa){
  61.                         content= content + '<div id="pole_dobre" onclick="wypelnij()"></div> ';
  62.                     }else{
  63.                         content = content + '<div class="pole"></div> ';
  64.                     }
  65.                 }
  66.                 console.log(score);
  67.                 document.getElementById('plansza').innerHTML=content;
  68.                 document.getElementById('wynik').innerHTML=score;
  69.             }
  70.            
  71.             function czas(){
  72.                 var i=21;
  73.                 const time = setInterval(function() {
  74.                     i--;
  75.                     console.log(i);
  76.                     document.getElementById('zegar').innerHTML = i;
  77.  
  78.                     if (i == 0) {
  79.                         clearInterval(time);
  80.                         document.getElementById('plansza').innerHTML = '<h1>Twój wynik to:'+score+'</h1><br><h1 onclick="czas();reset();wypelnij()">Aby rozpocząć ponownie kliknij na napis</h1>';
  81.                     }
  82.                 }, 1000);
  83.                
  84.             }
  85.         </script>
  86.     </head>
  87.     <body>
  88.         <div id="container">
  89.             <div id="plansza">
  90.                 <h1 onclick="czas(); wypelnij()">ABY ROZPOCZĄĆ GRE KLIKNIJ NA NAPIS</h1>
  91.             </div>
  92.             <div id="dodatkowe">
  93.                 <h1>ZASADY GRY</h1> <br>
  94.                 "kliknij jak najwięcej razy w zielony kwadracik :)" <br>
  95.                 Czas : <span id="zegar"></span> <br>
  96.                 Wynik: <span id="wynik"></span> <br>
  97.             </div>
  98.         </div>
  99.     </body>
  100. </html>
Advertisement
Add Comment
Please, Sign In to add comment