Code du jeu Web Snake
<style>
::sélection {
couleur:#FFFFFF;
fond:transparent;
}
::-moz-sélection {
couleur:#FFFFFF;
fond:transparent;
}
*{
marge:0;
remplissage :0 ;
famille de polices : "VT323" ;
}
corps {
couleur d'arrière-plan :#000000;
}
.wrap {
marge-gauche:auto;
marge droite:auto;
}
en-tête {
largeur:340px;
taille de police:0;
}
toile {
affichage : aucun ;
style de bordure:solide;
largeur de bordure : 10 px ;
couleur de la bordure :#FFFFFF;
}
toile: focus {
contour :aucun ;
}
/* Meilleurs styles */
h1 {
display:bloc-en-ligne;
largeur:100px;
taille de police : 32px ;
couleur:#FFFFFF;
}
.score {
display:bloc-en-ligne;
largeur:240px;
taille de police : 20px ;
couleur:#FFFFFF;
aligner le texte : droit ;
}
.score_value {
taille de police: hériter;
}
/* Style de tous les écrans */
#gameover a,#setting a,#menu a {
affichage:bloc;
}
#gameover a,#setting a:hover,#menu a:hover {
curseur:pointeur;
}
#gameover a:hover::before,#setting a:hover::before,#menu a:hover::before {
contenu :">";
marge droite : 10px ;
}
/* Style d'écran de menu */
#menu {
affichage:bloc;
largeur:340px;
rembourrage supérieur : 95 px ;
padding-bottom:95px;
taille de police : 40px ;
marge-gauche:auto;
marge droite:auto;
texte-align:center;
couleur:#FFF;
}
#menuh2 {
-webkit-animation:logo-ani 1000ms linéaire infini ;
animation:logo-ani 1000ms linéaire infini ;
marge inférieure : 30px ;
}
#menua {
taille de police : 30px ;
}
@-webkit-keyframes logo-ani {
50 % {
-webkit-transform:scale(1.3,1.3);
}
100% {
-webkit-transform:scale(1.0,1.0);
}
}@keyframes logo-ani {
50 % {
transformer:scale(1.3,1.3);
}
100% {
transformer:scale(1.0,1.0);
}
}/* Style de jeu sur écran */
#gameover {
affichage : aucun ;
largeur:340px;
rembourrage supérieur : 95 px ;
padding-bottom:95px;
marge-gauche:auto;
marge droite:auto;
texte-align:center;
taille de police : 30px ;
couleur:#FFF;
}
#gameover p {
marge supérieure : 25 px ;
taille de police : 20px ;
}
/* Style d'écran des paramètres */
#paramètre {
affichage : aucun ;
largeur:340px;
marge-gauche:auto;
marge droite:auto;
rembourrage-top : 85px ;
padding-bottom:85px;
taille de police : 30px ;
couleur:#FFF;
texte-align:center;
}
#réglage h2 {
marge inférieure : 15px ;
}
#réglage p {
marge supérieure : 10 px ;
}
#paramètre d'entrée {
affichage : aucun ;
}
#setting label {
curseur:pointeur;
}
#setting input : coché + étiquette {
couleur d'arrière-plan :#FFF;
couleur:#000;
}
</style>
</tête>
<body><script src="/demos/googlegg.js"></script>
<header class="wrap">
<h1>Serpent</h1>
<p class="score">Score : <span id="score_value">0</span></p>
</en-tête>
<canvas class="wrap" id="snake" width="320" height="320" tabindex="1"></canvas>
<!-- Jeu sur écran -->
<div id="gameover">
<h2>Game Over</h2>
<p>appuyez sur <span style="background-color: #FFFFFF; color: #000000">space</span> pour commencer un</p>
<a id="newgame_gameover">nouveau jeu</a>
<a id="setting_gameover">settings</a>
</div>
<!-- Écran de réglage -->
<div id="setting">
<h2>Paramètres</h2>
<a id="newgame_setting">nouveau jeu</a>
<p>Vitesse :
<input id="speed1" type="radio" name="speed" value="120" vérifié/>
<label for="speed1">Lent</label>
<input id="speed2" type="radio" name="speed" value="75" />
<label for="speed2">Normal</label>
<input id="speed3" type="radio" name="speed" value="35" />
<label for="speed3">Rapide</label>
</p>
贪吃蛇网页小游戏代码是一款简单黑白风格好玩的在线网页小游戏特效。
Toutes les ressources de ce site proviennent d'internautes ou sont réimprimées par les principaux sites de téléchargement. Veuillez vérifier vous-même l'intégrité du logiciel ! Toutes les ressources de ce site sont uniquement à titre de référence d'apprentissage. Merci de ne pas les utiliser à des fins commerciales. Sinon, vous serez responsable de toutes les conséquences ! En cas d'infraction, veuillez nous contacter pour la supprimer. Coordonnées : admin@php.cn
Article connexe
16 May 2016
Cet article présente principalement les effets spéciaux de la version Web de js Snake. Le jeu comporte dix niveaux au total. Il est recommandé à tous les amis dans le besoin de s'y référer.
16 May 2016
Ci-dessous, l'éditeur vous proposera un article sur les effets spéciaux d'horloge Web réalisés avec du code pur js [avec exemples]. L'éditeur pense que j'ai mal entendu, je vais donc le partager avec vous maintenant et le donner comme référence. Suivons l’éditeur et jetons un coup d’œil.
07 Mar 2018
Nous savons tous que Canvas est en HTML5. Canvas peut créer de nombreux effets spéciaux et autres choses magiques. Bien sûr, JavaScript peut également le faire. Mais avez-vous déjà joué avec Canvas et JavaScript pour obtenir des effets spéciaux d'image ? regarder!
23 Dec 2020
Dang Dang Dang ~ Les derniers effets spéciaux d'animation de Noël sympas et magnifiques sont là ! Y compris les effets spéciaux implémentés en HTML5, CSS3, jquery et autres langages, qui sont simples et beaux. Vous pouvez cliquer sur le lien dans le texte pour un aperçu de l'animation. Ils sont tous gratuits. Bienvenue à partager et à télécharger.
16 May 2016
Nous avons compilé ici 10 codes populaires pour le texte, les boutons, les formulaires et autres effets spéciaux basés sur jQuery. Ils sont rassemblés pour une comparaison et une utilisation faciles.
02 Mar 2024
Quel est le prix du skin sauvage Aguduo de King of Glory ? Honor of Kings Agudo Wild Skin a attiré l'attention de nombreux joueurs. Les joueurs souhaitent connaître le prix spécifique et les effets spéciaux détaillés d'Agudo Wild Skin. L'éditeur a aidé les joueurs à trier les informations spécifiques sur le prix et les effets spéciaux d'Agudo Wild Skin. . Jetons un coup d'oeil. Liste des prix et des effets spéciaux de la peau sauvage d'Agudo dans "Glory of Kings" Réponse : Échangez des pièces d'étoile violettes pour une durée limitée. Liste des effets spéciaux de la peau sauvage d'Agudo Effets spéciaux d'apparence : Effets spéciaux passifs : Effets spéciaux d'attaque normale : Effets spéciaux de la première compétence : Effets spéciaux de la deuxième compétence : Effets spéciaux de la troisième compétence :
19 Apr 2024
Un aperçu des effets spéciaux du skin Mozi Golden Scorpio dans Honor of Kings, avec l'actualité du skin Mozi Golden Scorpio, de nombreux joueurs veulent connaître ce skin de la série Saint Seiya, alors laissez-moi vous en parler. ci-dessous. . King of Glory Liste des effets spéciaux du skin Mozi Gold Scorpion Liste des effets spéciaux du skin Mozi Gold Scorpion Effets spéciaux d'apparence : Effets spéciaux de retour en ville : Effets spéciaux passifs : Effets spéciaux d'attaque normale : Effets spéciaux de la première compétence : Effets spéciaux de la deuxième compétence : Effets spéciaux de la troisième compétence effets : Friends, en tant que skin de liaison, Mo La qualité du skin sous-Golden Scorpio et de la série précédente de skins liés à King of Glory et Saint Seiya est très élevée, tant en termes de sensations que d'effets spéciaux. Ça ne manque pas.
07 Mar 2024
Que diriez-vous des effets spéciaux du skin d'Evelynn dans le jeu mobile League of Legends ? Le skin d'Evelynn, le démon occidental, a été révélé cette fois. Examinons de plus près les effets spécifiques du skin et le prix d'Evelynn, le démon occidental. J'espère que cela pourra aider les joueurs. "League of Legends Mobile Game" Liste des effets spéciaux de la peau Western Shadow Evelynn Qualité de la peau : peau ordinaire de niveau T3. Prix du skin : coupon de 7900 points (équivalent à 79 yuans) Comment l'obtenir : vente directe au centre commercial. Liste des effets spéciaux du skin d'Evelynn dans l'Ouest. Effets spéciaux de retour en ville : Effets spéciaux passifs : Effets spéciaux d'attaque de base : Effets spéciaux de compétence Q : Effets spéciaux de compétence W : Effets spéciaux de compétence E : Effets spéciaux de compétence R :
Hot Tools
jQuery+Html5 réalise un magnifique code d'animation de confession
jQuery+Html5 implémente un magnifique code d'animation de confession, l'effet d'animation est génial, un incontournable pour que les programmeurs se confessent !
Code d'effets spéciaux js pour la confession romantique d'un couple
Code d'effets spéciaux JS pour la confession romantique des couples. De tels effets spéciaux peuvent être utilisés sur des sites Web de photographie de mariage ou placés sur des sites Web personnels. C'est également un bon effet spécial que le site Web chinois PHP recommande de télécharger !
Simple js aime l'artefact de confession
Artefact de confession d'amour simple en js natif
Effets expressifs d'animation de particules HTML5 de Bunker
Code d'effets spéciaux d'expression d'animation de particules HTML5 de Bunker, le texte des effets spéciaux d'animation peut être modifié dans le code, vous pouvez créer une page, vous pouvez personnaliser la saisie de texte, il devrait être très populaire, cet effet spécial HTML5 est très beau.
Modèle d'interface de connexion en arrière-plan réactif jQuery
Code source HTML du modèle d'interface de connexion backend réactif jQuery. La page de connexion utilise jquery pour vérifier le formulaire et déterminer si le nom d'utilisateur et le mot de passe répondent aux exigences. Habituellement, la page de connexion est une page qui doit être utilisée sur les sites Web d'entreprise ou les sites Web réactifs des centres commerciaux. pages, lorsque le navigateur effectue un zoom avant ou arrière, l'arrière-plan redimensionnera l'image en fonction du navigateur ! Le site Web chinois PHP recommande le téléchargement !