xTibia

.com
TH
javascript

Joguinho Em Javascript

Por The Taker, 03 de jan. de 2008 em Programação Web

script
4
2k
The TakerT
03 de janeiro de 2008 às 13:37

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. o.O 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

Editado Janeiro 3 por The Taker

3 meses depois...
franlineF
17 de abril de 2008 às 14:29

Não conheço java!

da umas dicas pra mim ver se consigo jogar ^^

The TakerT
17 de abril de 2008 às 15:09

Quando você abre a página ela diz o que você tem que fazer para jogar.

 

Qualquer dúvida no script é só me dizer.

3 meses depois...
xdtibia16X
10 de julho de 2008 às 12:42

Não gostei.

É muito facil fazer isso.

Editado Agosto 11 por Aluxes