Cette page HTML présente une implémentation interactive du "Jeu de la vie" de John Horton Conway, un célèbre automate cellulaire. Voici une explication détaillée de ses fonctionnalités, structurée selon les langages utilisés : HTML, CSS et JavaScript. lancement du jeu
Vous pouvez voir une démo de cette page sur [vercel].
- Structure de base : La page contient des éléments de base comme
<head>
et<body>
. - Préchargeur : Il y a un préchargeur animé qui s'affiche avant le chargement du jeu.
- Titre et boutons : Le titre du jeu est affiché avec des boutons pour démarrer, mettre en pause, réinitialiser le jeu, etc.
- Conteneur de grille : Un élément
<div>
sert de conteneur pour la grille du jeu. - Contrôles supplémentaires : Des éléments pour ajuster la taille de la grille et générer des configurations aléatoires.
- Mise en page et style : Le CSS utilise le framework Tailwind pour le style de base et ajoute des styles personnalisés pour la grille, les cellules et les animations.
- Animations : Des animations clés (
@keyframes
) sont définies pour les transitions et les effets visuels. - Responsive design : Des styles tels que
max-width
ettransform
permettent une bonne présentation sur différents appareils.
- Manipulation de la grille : Le script crée dynamiquement la grille et gère les interactions avec les cellules.
- Logique du jeu : Implémente les règles du Jeu de la vie pour déterminer l'état des cellules (vivante ou morte) à chaque génération.
- Contrôle d'interface : Les boutons sont liés à des fonctions JavaScript pour démarrer, mettre en pause et réinitialiser le jeu.
- Zoom et vitesse : Des fonctionnalités pour zoomer dans la grille et ajuster la vitesse de l'automate.
- Génération aléatoire : Des fonctions pour remplir la grille avec des cellules vivantes selon des probabilités définies.
Ce projet est sous licence MIT.
- [GitHub](
- [LinkedIn](