Accueil­FAQ­Rechercher­S'enregistrer­Membres­Groupes­Connexion
Poster un nouveau sujet   Répondre au sujetPartager | 
 

 Tutorial Javascript : Partie 2

Voir le sujet précédent Voir le sujet suivant Aller en bas 
AuteurMessage
Cyrhades
Experimenté
Experimenté


Masculin Nombre de messages: 437
Age: 27
Programme utilisé (Gm/RmXp/...): NotePad
Loisirs: Programmation
Date d'inscription: 03/07/2006

MessageSujet: Tutorial Javascript : Partie 2   Mer 5 Juil - 12:12

C'est parti pour le premier vrai script (jauge d'energie)

Et non on a pas sauté d'étapes une jauge d'énergie c'est quoi ?
C'est une barre qui peut diminuer ou augmenter suivant certaine condition, et vous avez deja travaillé des conditions la c'est la même chose vous allez voir ;-)

Allez voir mon exemple : http://lcproduction.free.fr/tutorial/jauge.html

Bon il faut savoir que nous allons travaillé avec du html dans lequel nous allons appliqué des "style" sur certaine balise (les "style" peuvent être intégré dans une feuille css pour une modification simplifié.





html>
script language="javascript">
!--


// la variable vie à la valeur numérique 50
var taux = 50;

// on crée une fonction cela permet d'appeler le script qu'elle
// contient juste en l'appelant voilà c'est ça une fonction, ici
// notre fonction est appelé mavie() c'est ainsi qu'on lui fait appel

function mavie()
{
document.getElementById("lavie").style.width=taux+"px";
}
// Mais elle est bizar cette fonction y a un truc dans c'est parenthese
// bah ce truc c'est une variable dont la valeur est inconnu tant que l'appel
// de la variable n'a pas été fait. cette fois on appel la fonction ainsi :
// [color=indigo]// on crée une fonction cela permet d'appeler le script qu'elle
// contient juste en l'appelant voilà c'est ça une fonction, ici
// notre fonction est appelé [color=red]mavie()
c'est ainsi qu'on lui fait appel
// evenement([color=red]"ma valeur entre guillemet")[/color]
// entre guillemet car c'est un texte, sans guillemet si c'est une variable ou une autre fonction
[/color]
function evenement([color=red]val)[/color]{
if (taux+val>=100) { taux=100; mavie(); alert("votre vie est complete");}
else if (taux+val=0){ taux=0; mavie(); alert("vous êtes mort");}
else { taux=taux+val; mavie();}
}

-->
/script>
body onload="javascript:mavie();">
form name="formulaire">
nombre de point de vie à ajouter par clique sur la trousse à pharmaciebr>
input type="texte" name="evenajout" value="10" maxLength="3" onKeypress="if(event.keyCode 45 || event.keyCode > 57) event.returnValue = false; if(event.which 45 || event.which > 57) return false;">
br>
nombre de point de vie retirer par clique sur le poisonbr>
input type="texte" name="evenretire" value="5" maxLength="3" onKeypress="if(event.keyCode 45 || event.keyCode > 57) event.returnValue = false; if(event.which 45 || event.which > 57) return false;">

form>
div id="conteneur" style="margin:0px; border: ridge 2px #E9E9E9; font:1pt; width:104px; height:8px; background:#cccccc;">
div id="lavie" style="height:100%; background:red;">/div>/div>
/body>
br>
a href=javascript:evenement(+document.formulaire.evenajout.value);>
img src="http://lcproduction.free.fr/tutorial/images/secour.gif" border="0">/a>  
a href=javascript:evenement(-document.formulaire.evenretire.value);>
img src="http://lcproduction.free.fr/tutorial/images/poison.gif" border="0">/a>
br>br>

/html>



Une petite explication s'impose
- Pourquoi ai je mis la fonction mavie(); dans chacune des conditions?
simplement car je voulais afficher une alert et donc je trouver mieux de montrer la vie descendre avant l'alert,
- Y a pas un autre moyen de faire?
Eh bien oui mais justement vous faite bien de poser la question, vous allez le faire en exercice pour la peine :p


Exercice N°1

Pour votre aide je vous cré l'algorithm qui vous aidera a créer ce petit exercice à vous de traduire en javascript (vous avez tout le nécessaire pour le faire.

surtout si il y a le moindre le blocage envoyez moi un MP je vous aiderez ne vous dégoutez pas du javascript, c'est un language de programmation tres tres simple.
Sincerement grace a Javascript vous pourrez créer un petit jeu en 2D en moins de 2 semaines
d'apprentissage je vous garanti qu'avant la fin du moi je vous aurez permis de créer votre jeu on y arrive doucement. Persistez mais n'hésitez pas à poser vos questions.

Algorithm ( c'est un "language" humain dictant un code) c'est ma définition je vois pas comment trop expliquer sinon ^^

Traduction humaine vers javascript
Je vous fais un début de tablea vous pouvez le compléter si ça vous chante

DEBUT => script language="javascript">
var => var (la même chose pour déclarer une variable)
si => if
alors => { ... }
ecrire => une alert par exemple
lire => nom_de_varaiable
sinon => else
sinon si => else if
FIN => /script>
exemple :

---- ALGORITHM ----
DEBUT
si 1 egal 1
alors message "mon message 1 est egal a 1, on en apprend tout les jours"
sinon
message "Ah bah je croyais autant pour moi"
FIN

---- jAVASCRIPT ----
script language="javascript">
if (1==1)
{ alert("mon message 1 est egal a 1, on en apprend tout les jours"); }
else
alert("Ah bah je croyais autant pour moi");
/script>
Revenir en haut Aller en bas
Voir le profil de l'utilisateur http://lcproduction.free.fr/
 

Tutorial Javascript : Partie 2

Voir le sujet précédent Voir le sujet suivant Revenir en haut 
Page 1 sur 1

Permission de ce forum:Vous ne pouvez pas répondre aux sujets dans ce forum
Game Maker Zone :: Programmation/Graphisme :: Programmation web :: Scripts - Exemples-
Poster un nouveau sujet   Répondre au sujet