Plug-in d'effets spéciaux de feux d'artifice réalistes basé sur un canevas HTML5

Bref tutoriel

jquery-fireworks est un plug-in jQuery pour des effets spéciaux de feux d'artifice réalistes basés sur HTML5 Canvas. Le plugin est simple à utiliser et librement configurable. Il peut générer des effets de feux d'artifice réalistes dans un conteneur div.

Méthode d'utilisation

Introduisez les fichiers jquery et jquery.fireworks.js dans la page.

<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.fireworks.js"></script>

La structure HTML

utilise un élément

<div class="demo"></div>

Plug-in d'initialisation

Une fois l'élément DOM de la page chargé, vous pouvez initialiser le plug-in d'effets spéciaux de feux d'artifice via la méthode fireworks()

$('.demo').fireworks({ 
  sound: true, // 声音效果
  opacity: 0.9, 
  width: '100%', 
  height: '100%'
});

Les feux d'artifice du canevas HTML5 L'adresse github du plug-in d'effets spéciaux est : https://github.com/mgrigajtis/jquery-fireworks

Ce qui précède est le contenu du plug-in d'effets spéciaux de feux d'artifice réalistes- basé sur un canevas HTML5. Pour plus de contenu connexe, veuillez faire attention au site Web PHP chinois (www .php.cn) !

Étiquettes associées：

HTML5，canvas，烟花特效

source：php.cn

Article précédent：15 plug-ins d'horloge d'apparence différente basés sur Canvas Article suivant：18 types d'effets spéciaux d'animation de texte basés sur anime.js

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

Derniers articles par auteur

• Matériel vidéo sur la création de votre propre framework PHP à partir de zéro
  2023-03-15 16:54:01
• Exemple d'analyse de la façon dont PHPMailer utilise la boîte aux lettres QQ pour compléter la fonction d'envoi d'e-mails
  2023-03-15 12:26:02
• Introduction à la façon de recevoir des e-mails en IMAP en php
  2023-03-14 18:58:01
• Exemple de mise en œuvre rapide de la déduplication de tableau en PHP
  2023-03-14 11:30:01
• Résumé de l'utilisation de tous les attributs de la balise en html
  1970-01-01 08:00:00
• Résumé des connaissances de base de PHP (nécessaire aux débutants pour débuter)
  2023-03-16 15:20:01
• Introduction à l'utilisation de typeof en JavaScript
  1970-01-01 08:00:00
• Introduction à l'utilisation de la méthode confirm() en JavaScript
  1970-01-01 08:00:00
• Une introduction détaillée à l'attribut HTML5 Placeholder
  1970-01-01 08:00:00
• Comment implémenter la sélection unique, la sélection multiple et la sélection inversée dans les formulaires dans ReactJS
  1970-01-01 08:00:00

Derniers numéros

function_exists() ne peut pas déterminer la fonction personnalisée Function test () {return true;} if (function_exists ('test')) {echo "le test est une ...

Depuis 2024-04-29 11:01:01

0

2

1940

Comment afficher la version mobile de Google Chrome Bonjour professeur, comment puis-je changer Google Chrome en version mobile ?

Depuis 2024-04-23 00:22:19

0

10

2110

La fenêtre enfant exploite la fenêtre parent, mais la sortie ne répond pas. Les deux premières phrases sont exécutables, mais la dernière ne peut pas être implémentée...

Depuis 2024-04-19 15:37:47

0

1

1781

Il n'y a aucune sortie dans la fenêtre parent document.onclick = function(){ window.opener.document.write('Je suis la sortie de la fenêt...

Depuis 2024-04-18 23:52:34

0

1

1680

Où sont les didacticiels sur la cartographie mentale CSS ? Didacticiel

Depuis 2024-04-16 10:10:18

0

0

1691

Rubriques connexes

Plus>

• Quelles sont les méthodes de production de production d'animation html5 ?
• La différence entre HTML et HTML5
• Pièce de dragon d'inscription Bitcoin
• Comment convertir nef au format jpg
• win10 se connecte à une imprimante partagée
• Comment ouvrir un fichier au format CSV
• Comment utiliser la sous-intrigue dans Matlab
• mysql créer une base de données