recherche

Maison >interface Web >js tutoriel >jquery réalise le partage de code de l'effet flocon de neige de bénédiction de Noël avec des flocons de neige volant dans le ciel_jquery

jquery réalise le partage de code de l'effet flocon de neige de bénédiction de Noël avec des flocons de neige volant dans le ciel_jquery

WBOY
WBOYoriginal
2016-05-16 15:43:571643parcourir

Il s'agit d'un code d'effet de flocon de neige de bénédiction de Noël basé sur jquery pour implémenter les flocons de neige volant partout dans le ciel. La taille des flocons de neige peut être modifiée et l'utilisateur peut également modifier l'image d'arrière-plan. code source des effets.

L'effet de flocon de neige de bénédiction de Noël jquery avec des flocons de neige volants dans le ciel, vous pouvez cliquer pour sélectionner différents effets, profitez-en.

Démonstration de l'effet Téléchargement du code source (S'il ne fonctionne pas correctement dans le navigateur, vous pouvez essayer de changer de mode de navigation ou choisir de télécharger directement)

Le code d'effet de flocon de neige de bénédiction de Noël jquery pour les flocons de neige volant dans le ciel est le suivant 

<!DOCTYPE html>
<html>
<head>
 <script type="text/javascript" src="images/jquery-latest.min.js"></script>
 <script src='images/snowfall.jquery.js'></script>
 <link rel="stylesheet" href="images/styles.css"></link>
</head>
<body class="darkBg">
 <input type="button" id="clear" value="Click to clear"/>
 <input type="button" id="round" value="Rounded"/>
 <input type="button" id="shadows" value="Shadows"/>
 <input type="button" id="roundshadows" value="Rounded Shadows"/>
 <input type="button" id="deviceorientation" value="Deviceorientation"/>
 <div class="collectonme">
 <p>Collect on meeeeee!!!</p>
 </div>
 <div class="collectonme">
 <p>Collect on meeeeee!!!</p>
 </div>
 <div class="collectonme">
 <p>Collect on meeeeee!!!</p>
 </div>
</body>
 <script type='text/javascript'> 
 $(document).ready(function(){
 $('.collectonme').hide();
 //Start the snow default options you can also make it snow in certain elements, etc.
 $(document).snowfall();
 
 $("#clear").click(function(){
 $(document).snowfall('clear'); // How you clear
 });
 
 $("#round").click(function(){
 document.body.className = "darkBg";
 $('.collectonme').hide();
 $(document).snowfall('clear');
 $(document).snowfall({round : true, minSize: 5, maxSize:8}); // add rounded
 });
 
 $("#shadows").click(function(){
 document.body.className = "lightBg";
 $('.collectonme').hide();
 $(document).snowfall('clear');
 $(document).snowfall({shadow : true, flakeCount:200}); // add shadows
 });

 $("#roundshadows").click(function(){
 document.body.className = "lightBg";
 $('.collectonme').hide();
 $(document).snowfall('clear');
 $(document).snowfall({shadow : true, round : true, minSize: 5, maxSize:8}); // add shadows
 });
 
 

 $("#deviceorientation").click(function(){
 $(document).snowfall('clear');
 $('.collectonme').hide();
 document.body.className = "darkBg";
 $(document).snowfall({deviceorientation : true, round : true, minSize: 5, maxSize:8});
 });

 });
 </script>

<p align="center"><font color="#FFFFFF">来源：</font><a href="http://www.jb51.net/" target="_blank"><font color="#FFFFFF">脚本之家</font></a></p>
</html>

Ce qui précède est le code d'effet de flocon de neige de bénédiction de Noël jquery pour les flocons de neige volants, j'espère que vous l'aimerez.

Déclaration：
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Article précédent：Exemple complet de plug-in de validation de formulaire universel implémenté par les compétences JS_javascriptArticle suivant：Exemple complet de plug-in de validation de formulaire universel implémenté par les compétences JS_javascript

Articles Liés

Voir plus