樱花飘落代码

 二维码 9
发表时间:2021-02-24 15:44作者:xjvae来源:xjvae网址:https://www.xjvae.cn/

代码如下:

<div class="meiha"></div>

<!-- 配套样式,可以替换其中的图片地址 -->

<style>

/** 樱花枝 **/

.meiha {

    position: fixed;

    top: 0;

    right: 0;

    z-index: 999;

    width: 350px;/** PNG图宽度 **/

    height: 231px;/** PNG图高度 **/

    pointer-events: none;

    background: url('http://X.png');

}

</style>


<script>

  var scroll = new SmoothScroll('a[href*="#"]', {

    speed: 200

  });

</script>

<canvas class="fireworks" style="position: fixed; left: 0px; top: 0px; z-index: 1; pointer-events: none; width: 1920px; height: 413px;" width="3840" height="826"></canvas>

<script type="text/javascript" src="//cdn.bootcss.com/animejs/2.2.0/anime.min.js"></script>

<script type="text/javascript" src="/media/js/mouse/fireworks.js"></script>

<script src="/media/js/cool.js"></script>

<script src="https://cdn.jsdelivr.net/gh/lete114/CDN/Sum/sakura.js"></script>

<canvas height="916" width="1920" style="position: fixed;left: 0;top: 0;pointer-events: none;" id="canvas_sakura"></canvas>




图片预览:

樱花.png

樱花效果.png

文章分类: 随笔
分享到: