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
Libérer: 2016-05-16 15:43:57
original
1652 Les gens l'ont consulté

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>
Copier après la connexion

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.

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal