Fermer

Visiteur non-identifié | Identifiez-vous | Devenir membre
Code perdu ? | Combien de visiteurs sur votre site ?

JSpace Invaders

Script posté par :

Javatwister - (Site : JavaTwist)
Vous aussi, postez vos scripts en cliquant ici.

Description

Le classique arcane relooké pour le plaisir en javascript ^_^

Compatibilité :

	FireFox : Toutes versions
	Mozilla : 1 et +
	Netscape Navigator : 6 et +
	Internet Explorer : 5 et +

Ce script utilise le DHTML

Chiffres :

Date de création : 9/05/2005
Dernière modif : -
Visites de la page : 28997
Envois par mail : 649

Exemple :

Cliquez ici

Le code :

Entre <HEAD> et </HEAD> :

#total {font-family:ms sans serif,courier ;position:absolute;top:5px;left:5px;color:#ffffff;font-size:30px}

#cadre {cursor:crosshair;margin-top:50px;margin-left:100px;overflow:hidden;background-color:#000000;width:600px;height:300px;position:relative;}
#cadre2 {position:absolute;top:0px;left:0px;}
#cadre2 div div {width:5px;z-index:2;margin-bottom:30px;background-color:#ffff00;height:30px;}
#cadre3 {z-index:2;position:absolute;top:0px;left:0px;}
#cadre3 img {position:absolute;}

#cache {background-color:#000000;position:absolute;width:600px;height:24px;left:0px;top:276px;}

#info {text-align:left;margin-left:50px;}
#info img {vertical-align:middle}
#info span {vertical-align:middle}
</style>

new Image().src="img/invader.gif";
new Image().src="img/invader2.gif";
new Image().src="img/invader3.gif";
new Image().src="img/invader4.gif";
new Image().src="img/explosion.gif";
new Image().src="img/explosion2.gif";

//^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ 
//^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ 
//^_^ ^_^ ^_^ ^_^   Copyright © javatwist.imingo.net - 2005   ^_^ ^_^ ^_^ ^_^  
//^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ 
//^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^ ^_^

var f, f1, canon, vies, para, cadreim, flag, flag2, r, r2, mort;
var tit, texte, texte2, timer, lettres, couleur, compt;

///////////////////////
// VARIABLES ONLOAD  //
///////////////////////
function variables(){
vies=document.getElementById('vies');
for(i=0;i<3;i++){
var vie=document.createElement('img');
vie.src="canon.gif";
vies.appendChild(vie)};
canon=document.getElementById('curs');
f1=document.getElementById('cadre2');
f=document.getElementById('cadre2').getElementsByTagName('div');
cadreim=document.getElementById('cadre3');
couleur='#ffffff'
compt=0;
texte="JSpace Invaders";
texte2="Game Over";
}

///////////////////////
// LANCEMENT "START" //
///////////////////////
function debut(bouton,e){
if(e.pageX){e.stopPropagation()}
else{window.event.cancelBubble=true}

if(mort){clearTimeout(mort)};
canon.src="img/canon.gif";
canon.style.top="276px";
while(tit.lastChild){tit.removeChild(tit.lastChild)}

clearTimeout(lettres);

flag=false;
flag2=false;
r=1;
r2=1;

while(cadreim.lastChild){cadreim.removeChild(cadreim.lastChild)}

for(j=0;j<15;j++){
new init(Math.random()*-200,Math.random()*600,15,'img/invader.gif',200,10,10)};
bouton.style.visibility='hidden';
}

/////////////////////
// PERTE D'UNE VIE //
/////////////////////
function perdre(){
canon.src="img/explosion2.gif";
canon.style.top="0px";
canon.style.left="200px";
canon.style.left="200px";
mort=setTimeout("canon.style.top='-200px'",2000);
flag=true;
vies.removeChild(vies.getElementsByTagName('img')[vies.getElementsByTagName('img').length-1]);
if(vies.getElementsByTagName('img').length!=0){
document.getElementById('depart').style.visibility='visible';}
else{
couleur='#ff0000';
logo(texte2);
while(cadreim.lastChild){cadreim.removeChild(cadreim.lastChild)};
}
}

//////////////////
// NOUVEL ALIEN //
//////////////////
function init(h,l,large,imag,delai,desc,sc,opt){
var haz;
var ex=document.createElement('img');
cadreim.appendChild(ex);
ex.src=imag;
this.bouge=bouge();

if((h>=276)&&(h<300)&&(ex.src.search(imag)!=-1)&&(l-parseInt(canon.style.left)>=-15)&&(l-parseInt(canon.style.left)<=25)){
if(imag!="img/invader4.gif"){r=0;}else{r2=0};
};

if(h>0){
if(f.length!=0){
for(i=0;i<f.length;i++){
if((parseInt(f[i].style.top)<h+23)&&(f[i].style.display!='none')&&(ex.src.search("img/explosion.gif")==-1)&&(parseInt(f[i].style.left)-l>=5)&&(parseInt(f[i].style.left)-l<=20)&&(ex.src.search("img/invader4.gif")==-1)){
if(opt==true){para=opt;setTimeout("para=false",2000);};
ex.src="img/explosion.gif";f[i].style.display='none';compt+=sc;
if(compt%1000==0){init(Math.random()*-200,Math.random()*600,15,'img/invader4.gif',200,5)};
if(compt%300==0){init(Math.random()*-200,Math.random()*600,15,'img/invader2.gif',100,20,50)};
if(compt%400==0){init(Math.random()*-200,Math.random()*600,40,'img/invader5.gif',200,20,80)};
if(compt%500==0){init(Math.random()*-200,Math.random()*600,15,'img/invader3.gif',200,20,100,true)};
document.getElementById('total').firstChild.data=compt;
}}}};

haz=String(Math.random()-Math.random()).substring(0,1);
l+=parseInt(haz+Math.random()*large);
ex.style.left=l+"px";
ex.style.top=h+"px";

if(r==0){if(!flag){perdre()};
clearTimeout(timer)}
else{timer=setTimeout(bouge,delai)};

if(r2==0){if(!flag2){
flag2=true;
if(vies.getElementsByTagName('img').length<5){
var ange=document.createElement('img');
vies.appendChild(ange);
ange.src="img/canon.gif";
cadreim.removeChild(ex);
}}}

}
}

/////////////////
// NOUVEAU TIR //
/////////////////
function tir(n){
var feu=document.createElement('div');
feu.style.left=parseInt(canon.style.left)+17.5+"px";
for(i=0;i<3;i++){
var feu2=document.createElement('div');
feu.appendChild(feu2)}
f1.appendChild(feu);
feu.style.top=n+'px';
feu.style.position='absolute';
this.visee=visee();

function visee(){
if(n>-200){n-=10;feu.style.top=n+'px';setTimeout(visee,10)}
else{f1.removeChild(feu);};
}
}

//////////////////////////
// DEPLACEMENT DU CANON //
//////////////////////////
function glisse(e){
if((document.getElementById('curs').src.search('img/explosion2.gif')==-1) && (!para)){
if(e.pageX){
if(e.pageX<700 && e.pageX>100){
document.getElementById('curs').style.left=e.pageX-100-20;}}
else{
if(event.clientX<700 && event.clientX>100){
document.getElementById('curs').style.left=event.clientX-100-20;}}
}
}

/////////////////////////
// ANIMATION DE TEXTES //
/////////////////////////
function tourne(q,let){
var nd=document.createElement('span');
nd.style.color=couleur;
nd.appendChild(document.createTextNode(let));
tit.appendChild(nd);
this.tt=tt();

function tt(){
if(String.fromCharCode(q)!=let){
if(q<124){q++}else{q=32};
if(nd){
nd.firstChild.data=String.fromCharCode(q);};
}
lettres=setTimeout(tt,10)
}
}

///////////////////////////
// LANCEMENT D'ANIMATION //
///////////////////////////
function logo(quoi){
tit=document.getElementById('titre');
for(i=0;i<quoi.length;i++){
new tourne(32+Math.floor(Math.random()*91),quoi.charAt(i))}
}
</script>

Balise <BODY> :

Entre <BODY> et </BODY> :

</div>

<div style="margin:50px;">
JSpace Invaders est un jeu où on tue des aliens un peu primaires à coup de canon avant qu'ils ne nous descendent (comme le savent tous les plus de 30 ans);<br />
Utilisez uniquement la souris dans la zone de combat.<br />
<p id="info" style="text-align:left;margin-left:50px">
<img src="img/invader.gif" alt="alien de base" /> <span>[alien de base]</span> ==> 10 points<br/><br/>
<img src="img/invader2.gif" alt="alien rapide" /> <span>[alien rapide]</span> ==> 50 points <span> - un nouveau tous les 300 points</span> <br/><br/>
<img src="img/invader5.gif" alt="alien mobile" /> <span>[alien mobile]</span> ==> 80 points <span> - un nouveau tous les 400 points</span> <br/><br/>
<img src="img/invader3.gif" alt="alien paralysant" /> <span>[alien paralysant]</span> ==> 100 points <span> - un nouveau tous les 500 points</span> <br/><br/>
<img src="img/invader4.gif" alt="ange gardien" /> <span>[ange gardien]</span> ==> 0 points <span> - un nouveau (éphémère!) tous les 1000 points</span> <br/>
</p>
Les détails, vous les découvrirez en jouant...</ br>Bonne chasse!
</div>

document.onmousedown=no;
document.onmouseup=no;
if(typeof document.onselectstart!="undefined"){document.onselectstart=no}
</script>

Services email :

Je désire recevoir ce script par email
Je désire recevoir un email en cas de modification de ce script
Je désire m'abonner à la newsletter de l'éditeur JavaScript

Les annotations des visiteurs :

De samross - le 23-04-2005

dommage que les anges gardiens et les paralysant ne s affichent pas !
sinon c le top ! faudrais essayaer de les faire apparaitre et c tout bon !
samross@tiscali.fr

De hepcom - le 26-11-2007

Eh ! oui, un petit zip avec les images et ce serait super, en attendant merci

De isabe - le 02-01-2010

pour les images, il suffit de les enregistrer dans le dossier image du site et tout fonctionne parfaitement....merci pour ce jeu

De Internet Travel.fr - le 11-03-2010

Ca marche pas ton truc! J'les mis sur le code HTML d'une page de mon blog et ma page est devenue toute verte!

Si vous pouvez me dire comment ca marche, ca serais bien!

>> Poster une annotation sur ce script

compteur gratuit
actuellement en ligne

PUBLICITE

ANNUAIRE WEBMAST.

Net@Vous
6 Euros par an pour 40 Mo d'espace disque. Vraiment pas cher.
http://www.netavous.com/

Cat : Hebergement web
Voir l'annuaire webmaster

LES SCRIPTS :

78 à éditer
68 à copier/coller
247 des membres
2580 sur le web
>> Tous les scripts

LES MEMBRES :

61280 membres
7187 comptes CountUs
1719 comptes myCircle

LES FORUMS :

14 forums
39939 topics
190884 messages
>> Les forums

SONDAGE

La mini-astuce "HTML / CSS" du jour par KevBrok
Vous codez votre site en XHTML/CSS et il y a des bugs d'affichage sur IE? IE vous met 20px au lieu de 10? Encore le problème de padding?

Vous pouvez redéfinir un style qui ne sera pas pris en charge par IE en faisant:
body>.NomDuStyle
Proposer votre mini-astuce | Archives des mini-astuces

Pseudo :
Code :
	Se souvenir de moi