Skip welcome & menu and move to editor
Welcome to JS Bin
File
Add library
Share
Login or Register
Blog
Help
Load cached copy from
  • Run with JS
  • Save
  • Share
  • …
 
<!doctype html>
<html>
    <head>  
        <title>Changing Website Content</title>
        <link href='http://fonts.googleapis.com/css?family=Open+Sans' rel='stylesheet' type='text/css'>
        <style type="text/css">
            body {
                background-image: url('http://wallpapercave.com/wp/2N8Zebr.jpg');
                background-size: cover;
                width:100%;
                font-family: 'Open Sans', sans-serif;
            }
            #main {
                margin: 100px;
                background-color: #ede1e1;
                padding: 50px;
                position: relative;
                top: 50px;
            }
        </style>
    </head>
    <body>
        <div id="main">
            <p>How many fingers am I holding up? Pick a number 1 - 5.</p>
            <input id="fingers" type="text">
            <button type="submit" id="fingerChecker">Guess?</button>
        </div>
        You have answered correctly <span id='correct'>0</span> times.
​
        <script type="text/javascript">
           var globals = {
                correct : 0
           };
           document.getElementById("fingerChecker").onclick = function() {
                var fingers = document.getElementById("fingers").value;
                var random1 = (Math.floor((Math.random() * 5) + 1))
                if (fingers == (random1)) {
                    alert("Yes, you are correct!");
                    document.getElementById('correct').innerHTML = ++globals.correct;
                } else {
                    alert("Nope! I had " + random1);
                }
           }
        </script>
​
​
    </body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
rionmonsterpro
0viewers