crystianwendel/index.html

## index.html
<html>
    <head>
  	<meta charset="UTF-8">
        <title>Titulo</title>
        <link rel="stylesheet" type="text/css" href="estilo.css"/>
        <style rel="stylesheet" type="text/css">
            #popup {
                width: 50px;
                height: 50px;
                border: 1px solid red;
                position: fixed;
                top: 10px;
                left: 10px;
                background-color: #CCC;
            }
        </style>
    </head>
    <body>
        <h1>Exercícios</h1>
        <ol>
            <li>Fazer formulário com validação.
                <ol>
                    <li>Validar campos textuais para não ficarem vazios.</li>
                    <li>Exibir indicação de quais campos precisam de preenchimento no próprio HTML.</li>
                </ol>
            </li>
            <li>Fazer menu pop-up.
                <ol>
                    <li>Botão deve ativar menu pop-up.</li>
                    <li>Pop-up deve aparecer como uma div na página, e deve ter um botão de "close".</li>
                </ol>
            </li>
            <li>Fazer jogo! Jogo de perseguir o quadrado, que consiste de mostrar um quadrado em uma posicão aleatória da tela, e troca-lo de posição sempre que o usuário clicar nele.
                <ol>
                    <li>Pontuação do jogo deve ser mostrada em algum lugar na página, e o usuário ganha mais pontos se clicar no quadrado mais rapidamente.</li>
                    <li>Jogo termina depois de o usuário acertar o quadrado 10 vezes.</li>
                </ol>
            </li>
        </ol>

        <h2>Respostas</h2>
        <ol>
            <li><a href="https://gist.github.com/crystianwendel/6934003">https://gist.github.com/crystianwendel/6934003</a></li>
            <li><a href="https://gist.github.com/crystianwendel/6934917">https://gist.github.com/crystianwendel/6934917</a></li>
            <li>Aqui!</li>
        </ol>

        <div id="popup" onclick="randomPosition();">

        </div>


        <script language="javascript">
            function randomPosition() {
                width = window.innerWidth
                height = window.innerHeight

                r = Math.random();
                r = r * (width - 50);
                document.getElementById('popup').style.left = r + 'px';

                r = Math.random();
                r = r * (height - 50);
                document.getElementById('popup').style.top = r + 'px';


            }
        </script>
    </body>
</html>
	<html>
	<head>
	<meta charset="UTF-8">
	<title>Titulo</title>
	<link rel="stylesheet" type="text/css" href="estilo.css"/>
	<style rel="stylesheet" type="text/css">
	#popup {
	width: 50px;
	height: 50px;
	border: 1px solid red;
	position: fixed;
	top: 10px;
	left: 10px;
	background-color: #CCC;
	}
	</style>
	</head>
	<body>
	<h1>Exercícios</h1>
	<ol>
	<li>Fazer formulário com validação.
	<ol>
	<li>Validar campos textuais para não ficarem vazios.</li>
	<li>Exibir indicação de quais campos precisam de preenchimento no próprio HTML.</li>
	</ol>
	</li>
	<li>Fazer menu pop-up.
	<ol>
	<li>Botão deve ativar menu pop-up.</li>
	<li>Pop-up deve aparecer como uma div na página, e deve ter um botão de "close".</li>
	</ol>
	</li>
	<li>Fazer jogo! Jogo de perseguir o quadrado, que consiste de mostrar um quadrado em uma posicão aleatória da tela, e troca-lo de posição sempre que o usuário clicar nele.
	<ol>
	<li>Pontuação do jogo deve ser mostrada em algum lugar na página, e o usuário ganha mais pontos se clicar no quadrado mais rapidamente.</li>
	<li>Jogo termina depois de o usuário acertar o quadrado 10 vezes.</li>
	</ol>
	</li>
	</ol>

	<h2>Respostas</h2>
	<ol>
	<li><a href="https://gist.github.com/crystianwendel/6934003">https://gist.github.com/crystianwendel/6934003</a></li>
	<li><a href="https://gist.github.com/crystianwendel/6934917">https://gist.github.com/crystianwendel/6934917</a></li>
	<li>Aqui!</li>
	</ol>

	<div id="popup" onclick="randomPosition();">

	</div>


	<script language="javascript">
	function randomPosition() {
	width = window.innerWidth
	height = window.innerHeight

	r = Math.random();
	r = r * (width - 50);
	document.getElementById('popup').style.left = r + 'px';

	r = Math.random();
	r = r * (height - 50);
	document.getElementById('popup').style.top = r + 'px';


	}
	</script>
	</body>
	</html>