Effet de citrouilles, de fantômes et de chauves-souris sur mon site
Effet de citrouilles, de fantômes et de chauves-souris sur mon site pour Halloween
Vous souhaitez donner une touche à la fois effrayante et amusante à votre site web pour Halloween ?
Ajoutez des citrouilles, des fantômes et des chauves-souris grâce à cet effet simple à mettre en place ! ? ? ?
Nous avons créé un code que vous pouvez copier et coller dans le code de votre page web juste avant la balise « </body> ». De cette manière, vous pourrez transformer votre site en un véritable décor d’Halloween et surprendre vos visiteurs.
Les citrouilles brillent de leur sourire maléfique, les fantômes dansent dans l’obscurité et les chauves-souris volent en arrière-plan. Votre site web deviendra l’endroit idéal pour célébrer cette fête terrifiante !
N’hésitez pas à personnaliser l’effet selon vos préférences. Soyez créatif et laissez la magie d’Halloween envahir votre site web !
Joyeux Halloween pour tout le monde !
Pour des citrouilles : 
<script type="text/javascript" src="https://click123.ca/dist/js/pumpkin.js"></script>
Pour des fantômes :
<script type="text/javascript" src="https://click123.ca/dist/js/ghost.js"></script>
Pour des chauves-souris : 
<script type="text/javascript" src="https://click123.ca/dist/js/bat.js"></script>
Joyeux Halloween pour tout le monde !
Mangin-Voirin
dit :Bonjour j’ai essayé de mettre comme sur votre site à la fois l’animation des citrouilles, des fantômes et des chauves-souris. Mais quelque soit le navigateur utilisé seul le 1er mis en place (par exemple les citrouilles fonctionne) les 2 autres apparaissent en un seul exemplaire l’un sur l’autre figés en haut à gauche de la page…
Est-ce normal ou moi qui m’y prend mal?
De plus vous indiquez : «N’hésitez pas à personnaliser l’effet selon vos préférences» comment cela est-il possible? (peut-on ajuster le nombre de citrouilles ou autres?)
merci super travail
Team Click123
dit :Bonjour Mangin-Voirin,
Merci pour votre message et vos gentils mots à propos de notre travail, cela nous fait vraiment plaisir ! 😊
Concernant votre problème :
Ce comportement semble lié à un conflit entre les différents scripts d’animation. En effet, si vous ajoutez plusieurs animations en même temps (citrouilles, fantômes et chauves-souris), il est possible que certaines se chevauchent ou ne fonctionnent pas correctement. Cela est dû au fait que chaque animation utilise des paramètres similaires qui entrent en conflit.
Pour résoudre cela :
Ajoutez les scripts dans un ordre précis : Insérez les scripts un par un et testez leur fonctionnement avant de les empiler.
Personnalisez les identifiants ou classes des scripts : Si vous êtes à l’aise avec un peu de code, modifiez les identifiants ou noms des classes pour éviter les conflits entre eux.
Personnalisation des effets :
Oui, il est tout à fait possible d’ajuster le nombre d’éléments selon le script.
Si vous avez besoin d’une assistance plus spécifique pour ajuster les animations, n’hésitez pas à nous partager vos fichiers ou votre code. Nous serons ravis de vous aider ! 😊
Excellente journée et Joyeux Noël à vous ! 🎄🎁✨
L’équipe de Click123 🎃👻🦇
Mangin-Voirin
dit :Merci pour votre réponse hyper rapide!
J’ai tester les 3 scripts un par un, seul ils fonctionnent très bien dès que j’en rajoute un le 2eme cela affiche juste l’icône en haut à gauche pour le 2eme, en inversant l’ordre du code on inverse celui qui ne fonctionne pas.
J’ai changé le nom des variables afin de ne pas avoir 2 fois le même nom de variables JavaScript dans la même page cela n’a rien changé. (ex: snowsrc et snowsrcA, sy et syA, ns6up et ns6upA, snowIE_NS6 et snowIE_NS6A,…)
J’ai constaté que dans la variable snowsrc le paramètre no correspond au nombre d’icone.
Malheureusement je suis un petit amateur par rapport à votre super boulot! Mais je continue à faire des essais!
J’ai aussi essayé le déplacement du votre code JavaScript dans mon code PHP…
Je n’ai pas réussi, malheureusement!
Je vous joins le bout de code de ma page si vous avez une meilleure idée que les miennes…
Merci encore
Joyeux Noël à vous aussi!
Mangin-Voirin
dit :J’ai aussi essayer de modifier les valeurs dans les formules mathématiques pour ne pas forcement avoir le même «hasard» sans plus de succès…
Par contre je n’ai pas trop compris ce que vous m’indiquiez dans votre précèdent message concernant :
Personnalisez les identifiants ou classes des scripts : … modifiez les identifiants ou noms des classes pour éviter les conflits entre eux.
par exemple dans la fonction function snowIE_NS6A()
Merci
Mangin-Voirin
dit :Bonjour, j’ai aussi une question sur le réglage de la hauteur de l’apparition des gif.
Il me semblait que cela devait être indiqué dans function snowIE_NS6() via la partie de code :
doc_height=window.innerHeight que j’ai tenté de remplacer par
doc_height=window.screen.Height
(2 occurrence dans vote code)
source https://developer.mozilla.org/en-US/docs/Web/API/Screen/height
ceci afin de tenter de limiter les gif dans la partie visible de l’écran car lorsque l’on a une page très longue, on ne voit plus les gif pendant pas mal de temps d’où mon idée de limiter à la taille de l’écran de l’utilisateur et non pas à la taille de la page dont seul une petite partie est affichée…
Merci
Mangin-Voirin
dit :Bonne année 2025 à tous!
Je progresse un peu dans mes recherches pour réussir à avoir les 3 animations en même temps il faut que la variable No soit du plus petit au plus grand par exemple No=10 pour la 1er animation, No= 15 pour la 2eme et No=20 pour la 3eme!
Ceci étant j’ai tenté de donner un nom différent à la variable No et Sy dans chaque fonction No ,NoA et NoB sans succès!
Par contre le fait d’avoir plusieurs animations accélère grandement le temps de défilement des gif..
Je n’ai pas encore trouvé quelle fonction mathématique crée cela (cumule du temps de défilement à travers les différentes animations)dans votre code( vu mon niveau cela va prendre du temps).
Et il reste aussi toujours une icône de l’animation 12 et 3 en haut à gauche de la page (je les ai légèrement décalées pour mieux les voir)
J’ai mis en place une page de test si vous voulez constater par vous même…
Merci
Mangin-Voirin
dit :Bonjour, est-il normal que mes derniers posts en attente de modération ai disparus?
Merci
Team Click123
dit :Bonjour,
Merci beaucoup pour vos commentaires détaillés et pour votre intérêt envers nos animations saisonnières. Nous sommes ravis de voir que vous explorez les possibilités offertes par nos scripts et que vous faites des tests approfondis pour personnaliser votre site web !
Actuellement, les messages sont en modération, une procédure standard pour éviter les spams et garantir la sécurité du site. Nous apprécions votre patience à cet égard.
Concernant vos questions :
1. Combinaison des animations : Nous comprenons votre souhait d’avoir plusieurs animations en simultané. Cependant, ce type de personnalisation peut nécessiter des ajustements plus complexes au niveau des identifiants, des variables et des interactions entre les scripts. Nous ne pouvons pas garantir une solution rapide, mais nous examinerons cette possibilité lors de notre prochaine mise à jour.
2. Personnalisation des variables : Modifier les noms des variables est effectivement une étape importante pour éviter les conflits. Assurez-vous également que chaque script utilise des identifiants et des classes distincts.
3. Limitation des animations à la taille de l’écran : Votre approche d’utiliser `window.screen.Height` est intéressante. Cependant, cela peut entraîner des comportements inattendus selon les navigateurs. Nous recommandons plutôt de travailler avec `window.innerHeight`, qui est mieux adapté pour gérer la taille visible de la fenêtre.
4. Optimisation des animations : Les ajustements des variables pour modifier le comportement des animations nécessitent souvent des tests multiples. Nous vous encourageons à poursuivre vos expérimentations tout en gardant une copie de sauvegarde de vos scripts originaux.
Nous ne pouvons malheureusement pas garantir une révision immédiate de ces points, mais nous prendrons vos suggestions en compte pour les futures améliorations.
Merci encore pour vos encouragements et vos vœux ! Nous vous souhaitons également une excellente année 2025, pleine de découvertes et de réussites. 🎉
Cordialement,
L’équipe Click 123