Bom não tinha nada pra fazer, resolvi fazer esse joguinho para os que estão estudando Javascript.
O jogo eh simples, baseia em vc acertar a caixinha que fica se movendo pela tela composto por 3 níveis.
Lá vai o código.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" />
<meta http-equiv="Pragma" content="no-cache" />
<title>Acerte a Carrinha =P by Sem.iNick</title>
<style type="text/css">
<!--
body {
color:#FFFFFF;
}
#clicker {
background:#FFFFFF;
color:#000000;
position:absolute;
width:20px;
height:20px;
z-index:1;
left: 0px;
top: 0px;
text-align:center;
visibility:hidden;
}
-->
</style>
</head>
<body bgcolor="#000000">
<script type="text/javascript">
document.onkeypress = menu;
inicio = 0;
function menu() {
if(event.shiftKey && (event.keyCode == 73 || event.keyCode == 105) && inicio != 1 ) {
iniciar(0);
} else if(event.shiftKey && (event.keyCode == 80 || event.keyCode == 112) && inicio != 0 ) {
parar();
}else if(event.shiftKey && (event.keyCode == 82 || event.keyCode == 114) && inicio != 0) {
reinicio();
}
}
function iniciar() {
var getm = document.getElementById("tempom");
var gets = document.getElementById("tempos");
if(getm.innerHTML == "0" && gets.innerHTML == "00") {
getm.innerHTML = "1";
gets.innerHTML = "00";
var pontu = document.getElementById("pontua");
pontu.innerHTML = "0";
}
interval = setInterval("jogo()",nivel(true))
inttempo = setInterval("tempo()",1000);
var getdiv = document.getElementById("clicker");
with (getdiv) {
getdiv.onclick = pontuar;
getdiv.style.cursor = "pointer";
}
inicio = 1;
}
function parar() {
clearInterval(interval);
clearInterval(inttempo);
var getdiv = document.getElementById("clicker");
with (getdiv) {
onclick = null;
style.visibility = "hidden";
style.cursor = "default";
}
inicio = 0;
}
function pontuar() {
var pontu = document.getElementById("pontua");
var old = pontu.innerHTML;
Number(old);
old++;
pontu.innerHTML = old;
var getdiv = document.getElementById("clicker").style;
var leftn = Rand(0,95);
var topn = Rand(0,95);
with(getdiv) {
left = leftn+"%";
top = topn+"%";
}
//Coloque as 2 proxima linhas como comentario q o jogo fica mais dificil =), mas ele ficara meio doido =P.
clearInterval(interval);
interval = setInterval("jogo()",nivel(true))
}
function jogo() {
var div = document.getElementById("clicker").style;
var leftn = Rand(0,95);
var topn = Rand(0,95);
with(div) {
visibility = "visible";
left = leftn+"%";
top = topn+"%";
}
}
function tempo() {
var getm = document.getElementById("tempom");
var gets = document.getElementById("tempos");
var oldm = getm.innerHTML;
var olds = gets.innerHTML;
Number(oldm);
Number(olds);
olds--;
if(oldm == 1) {
olds = 59;
}
if(oldm > 0)
oldm--;
if(olds < 10) {
olds = "0"+olds;
}
getm.innerHTML = oldm;
gets.innerHTML = olds;
if(olds == 0) {
parar();
nivel(false);
alert("Sua pontuaçao foi: "+document.getElementById("pontua").innerHTML+". =]");
}
}
function Rand(men,mai) {
var inter = mai - men;
inter++;
var num = Math.random() * inter;
num = Math.floor(num);
num += men;
return num;
}
function nivel(ena) {
var getonivel = document.getElementById("nivel");
var nivel = getonivel.options[getonivel.selectedIndex].value;
getonivel.disabled = ena;
return nivel;
}
function reinicio() {
parar();
nivel(false);
var getm = document.getElementById("tempom");
var gets = document.getElementById("tempos");
getm.innerHTML = "1";
gets.innerHTML = "00";
var pontu = document.getElementById("pontua");
pontu.innerHTML = "0";
}
</script>
Para começar digite Shif+I, pausar Shift+P e reiniciar Shift+R.
Pontuação atual: <strong><font id="pontua">0</font></strong> Tempo Restante: <strong><font id="tempom">1</font>:<font id="tempos">00</font></strong>
<div id="clicker" onClick="pontuar()">^^</div>
<p>
<label>Nível
<select name="nivel" id="nivel">
<option value="1200" selected="selected">Fácil</option>
<option value="1000">Médio</option>
<option value="800">Difícil</option>
</select>
</label>
</p>
</body>
</html>
Espero que sirva para os que estão aprendendo.
Bugs falem para eu arrumar =]
Flws
