Formations

Publié le 18 décembre 2017 Mis à jour le 25 septembre 2020

Tuto - Votre premier jeu en HTML5, CSS3, JavaScript et jQuery

Comment réaliser un jeu de Memory en utilisant les langages et standards HTML5, CSS3, JavaScript et jQuery

En partant d'une feuille blanche, ce tuto vidéo va vous montrer comment réaliser un jeu de Memory en utilisant les langages et standards HTML5, CSS3JavaScript et jQuery. Le tout en 30 minutes chrono ! Au fil des neuf étapes nécessaires au développement du jeu, vous apprendrez de nombreuses choses.

Entre autres :

  • Vous saurez comment mettre en place un squelette standard en HTML5/CSS3 ;
  • Vous apprendrez à utiliser un générateur pseudo-aléatoire en JavaScript pour mélanger des cartes ;
  • Vous verrez comment manipuler le DOM pour y insérer des objets, modifier leur comportement et les mettre à jour pendant la partie ;
  • Vous verrez comment ajouter de l'interactivité au jeu en capturant les événements souris en JavaScript ;
  • Vous apprendrez à améliorer la présentation du jeu en utilisant du code CSS3 ;
  • Vous saurez comment insérer des sons dans un document HTML5 et comment les jouer en jQuery.


Trente minutes pour créer votre premier jeu ! Qu'en dites-vous ?

Table des matières de cette formation HTML (durée : 29m08s)

  • Introduction aux vidéos qui vont suivre
  • Création du squelette HTML5
  • Tirage aléatoire des cartes
  • Affichage des cartes
  • Ajout de l’interactivité
  • Mise en forme de la page
  • Détection des cartes appariées
  • Interdiction de retourner plus de deux cartes
  • Ajout de sons pour réagir au jeu
  • Détection du nombre de coups joués et du temps en fin de partie


Tuto - Votre premier jeu en HTML5, CSS3, JavaScript et jQuery
 
(5 euros)

Pour aller plus loin :

En savoir plus sur cette formation

Visiter fr.tuto.com


Mots-clés: Langages tutoriel Jeu JavaScript HTML 5 CSS tuto.com memory Tuto Html5 Css3 Jquery Standards Feuille

Voir plus de formations de cette institution

Accédez à des services exclusifs gratuitement

Inscrivez-vous et recevez des infolettres sur :

  • Les cours
  • Les ressources d’apprentissage
  • Le dossier de la semaine
  • Les événements
  • Les technologies

De plus, indexez vos ressources préférées dans vos propres dossiers et retrouvez votre historique de consultation.

M’abonner à l'infolettre


Effectuez une demande d'extrait d'acte de naissance en ligne !


Ajouter à mes listes de lecture


Créer une liste de lecture

Recevez nos nouvelles par courriel

Chaque jour, restez informé sur l’apprentissage numérique sous toutes ses formes. Des idées et des ressources intéressantes. Profitez-en, c’est gratuit !