Skip to content

Instantly share code, notes, and snippets.

@ksanchezcld

ksanchezcld/index.html

Forked from anonymous/index.html
Last active August 29, 2015 14:08
Show Gist options

  • Select an option

    Learn more about clone URLs
  • Save ksanchezcld/21946b545ec2567805c5 to your computer and use it in GitHub Desktop.

Select an option

Learn more about clone URLs
Save ksanchezcld/21946b545ec2567805c5 to your computer and use it in GitHub Desktop.
Download ZIP

Revisions

  1. @invalid-email-address Anonymous created this gist Nov 4, 2014.
    66 changes: 66 additions & 0 deletions index.html
    View file
    Original file line number Diff line number Diff line change
    @@ -0,0 +1,66 @@
    <!DOCTYPE html>
    <html>
    <head>
    <title>Reaction Game</title>

    <meta charset="utf-8">
    <meta http-equiv="Content-type" content="text/html; charset=utf-8" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />

    <style type="text/css">
    #circle{
    border-radius:50%;
    background-color:red;
    height:100px;
    width:100px;
    visibility:hidden;
    }

    </style>
    </head>
    <body>
    <button id="buttonStart">Start Reaction Game</button>
    <div id="circle"></div>

    <script type="text/javascript">
    var w = Math.max(document.documentElement.clientWidth, windows.innerWidth || 0);
    var h = Math.max(document.documentElement.cluientHeight, windows.innerHeight || 0);

    document.getElementById("buttonStart").onclick = function(){
    this.visibility="hidden";
    }

    var x = Math.floor(Math.random()*w);
    if (x>w-100){
    x=w-100;
    }

    var y = Math.floor(Math.random()*h);
    if (y>h-100){
    x=h-100;
    }
    placeDiv(x,y);
    document.getElementById("circle").style.visibility="visible";

    var start = new Date().getTime();

    document.getElementById("circle").style.visibility="hidden";
    alert("Reaction time:" + time + "ms.");
    document.getElementById("buttonStart").style.visibility="visible";
    }
    }

    this.style.visibility="visible";

    function placeDiv(x_pos, y_pos){
    var d = document.getElementById("circle");
    d.style.position = "absolute";
    d.style.left = x_pos+'px'
    d.style.top = y_post+'px'
    }
    </script>



    </body>
    </html>