Pour ajouter des animations, vous devez d'abord obtenir les autorisations nécessaires. ### Animation de Lignes Voici comment créer une animation de lignes qui se déplace autour du curseur : 1. Téléchargez le fichier JavaScript depuis ce lien : canvas-nest.js. Vous pouvez soit télécharger et héberger le fichier vous-même, soit utiliser le lien direct fourni. 2. Si vous hébergez le ficheir vous-même, remplacez l'attribut src par votre propre chemin d'accès. 3. Ajoutez ce code dans la section HTML de l'en-tête de votre blogue : ```
4. Paramètres : - `color` : couleur des lignes (par défaut : '0,0,0'). Trois valeurs séparées par des virgules représentent (R,G,B).
- `opacity` : transparence des lignes (entre 0 et 1, par défaut : 0.5).
- `count` : nombre total de lignes (par défaut : 150).
- `zIndex` : valeur z-index du fond (par défaut : -1).
\### Animation Live2D dans la Barre de Notifications Pour ajouter un personnage interactif Live2D dans votre barre latérale : 1. Insérez ce code dans la section **annonce latérale** de votre blogue : ```
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Live2D</title>
<link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/monster-jian/waifu.css"/>
<script src="https://cdn.bootcss.com/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
<div class="waifu" id="waifu">
<div class="waifu-tips" style="opacity: 1;"></div>
<canvas id="live2d" width="280" height="250" class="live2d"></canvas>
<div class="waifu-tool">
<span class="fui-home"></span>
<span class="fui-chat"></span>
<span class="fui-eye"></span>
<span class="fui-user"></span>
<span class="fui-photo"></span>
<span class="fui-info-circle"></span>
<span class="fui-cross"></span>
</div>
</div>
<script src="https://blog-static.cnblogs.com/files/monster-jian/live2d.min.js"></script>
<script src="https://blog-static.cnblogs.com/files/monster-jian/waifu-tips.js"></script>
<script type="text/javascript">initModel()</script>
</body>
</html>
<link rel="stylesheet" type="text/css" href="https://blog-static.cnblogs.com/files/monster-jian/flat-ui.min.css"/>
### Animation au Clic de la Souris Pour ajouter une animation lorsque vous cliquez sur la page : 1. Pour afficher des mots aléatoires : ```
2. Pour des effets de particules : ```
<script src="https://files.cnblogs.com/files/monster-jian/mouse-click.js"></script>
<canvas width="1777" height="841" style="position: fixed; left: 0px; top: 0px; z-index: 2147483647; pointer-events: none;"></canvas>
### Animation du Curseur Pour changer l'apparence du curseur : 1. Ajoutez ce code dans la section CSS personnalisée de votre blogue : ``` body { background-repeat: repeat; background-attachment: fixed; background-size: cover; cursor: url(https://files.cnblogs.com/files/monster-jian/cursor.ico), auto; }
Les URL fournies ci-dessus contiennent le nom d'utilisateur "monster-jian". Vous pouvez remplacer ces fichiers par vos propres fichiers hébergés sur votre propre serveur. </div></body></html>