index.html

   1 <!DOCTYPE html>
   2 <html>
   3         <head>
   4                 <meta charset="utf-8">
   5                 <title>Whack a mole</title>
   6                 <script defer src="maulwurf.js"></script>
   7                 <style>
   8                         [name=huegel]{width:90px;position:absolute;top:5px;background-color:#754119;border-radius:50%;height:90px}
   9                         [name=maulwurf]{width:50px;left:20px;top:20px;border-radius:50%;background-color:black;visibility:hidden;height:50px;position:absolute}
  10                         #score{position:absolute;top:5px;left:5px;font-size:30px;}
  11                         body{width:100%;height:100%;background-color:#A6BE3D}
  12                 </style>
  13         </head>
  14         <body>
  15                 <center>
  16                         <h1>Whack a mole</h1>
  17                         <div style="width:700px;position:relative;height:100px;">
  18                                 <div name="huegel"><div name="maulwurf"></div></div>
  19                                 <div name="huegel"><div name="maulwurf"></div></div>
  20                                 <div name="huegel"><div name="maulwurf"></div></div>
  21                                 <div name="huegel"><div name="maulwurf"></div></div>
  22                                 <div name="huegel"><div name="maulwurf"></div></div>
  23                                 <div name="huegel"><div name="maulwurf"></div></div>
  24                                 <div name="huegel"><div name="maulwurf"></div></div>
  25                         </div>
  26                         <span id="score"></span>
  27                 </center>
  28         </body>
  29 </html>