Width-JavaScript-Game/index.html at master · JulioMontas/Width-JavaScript-Game · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
<!DOCTYPE html>
<html lang="en">
  <head>
    <title></title>
    <link rel="stylesheet" type="text/css" href="css/tools/normalize.css">
    <link rel="stylesheet" type="text/css" href="css/tools/font-awesome.min.css">
    <link rel="stylesheet" type="text/css" href="css/master.css">
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script>$(document).ready(function () { $('body').hide().fadeIn(2500).delay(6000)});</script>
  </head>
  <body>
    <header>
      <div id="playerOneScore">
        <h1> <span id="oneTotalHits"> </span><i class="fa fa-male fa-lg"></i> left  <span id="OneScore"> </span></h1>
      </div>
      <div id="winner">
        <h1 id="theWinnerIs"> </h1>
      </div>
      <div id="playerTwoScore">
        <h1> <span id="TwoScore"></span> right   <i class="fa fa-male fa-lg"></i><span id="twoTotalHits"> </span></h1>
      </div>
    </header>
    <div id="menu">
      <div id="container">
        <div id="logo"><img src="img/logo.png" alt="Logo">
          <h3 id="slogan">< Who can take over the screen ></h3>
        </div>
        <nav>
          <ul>
            <li><a id="rules" href="#">Rules </a></li>
            <li><a id="play" href="#">Play</a>
              <audio id="beep-one" preload="auto">
                <source src="sound/mouseclik.wav" controls="">Your browser isn't invited for super fun audio time.
              </audio>
              <script>
                var beepOne = $("#beep-one")[0];
                $("a")
                .mouseenter(function() {
                beepOne.play();
                });
              </script>
            </li>
            <li><a id="replay" href="#">Replay</a></li>
          </ul>
        </nav>
      </div>
    </div>
    <div id="gameTable">
      <section id="one">
        <section class="playerOne"></section>
      </section>
      <section id="two">
        <section class="playerTwo"></section>
      </section>
      <section id="three">
        <section class="playerOne"></section>
      </section>
      <section id="four">
        <section class="playerTwo"> </section>
      </section>
      <section id="five">
        <section class="playerOne"></section>
      </section>
      <section id="six">
        <section class="playerTwo"></section>
      </section>
    </div>
    <footer>
      <p> <span>Left Press:</span> F </p>
      <p> <span>New Game:</span> Space</p>
      <p> <span>Right Press:</span> J  </p>
    </footer>
  </body>
  <script type="text/javascript" src="js/main.js"></script>
</html>