1
【笔记】Next8.8实现樱花飘飘特效
source link: https://feiju12138.github.io/2022/08/06/Next8-8%E5%AE%9E%E7%8E%B0%E6%A8%B1%E8%8A%B1%E9%A3%98%E9%A3%98%E7%89%B9%E6%95%88/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
【笔记】Next8.8实现樱花飘飘特效
2022-08-06
1
这是出自Leo的博客樱花飘落动效，但是原作者的博客已经打开了，所以从维安雨轩的博客摘抄过来了
我将源码简单的封装成了函数，将飘落物的图片作为了函数的参数，方便以后如果需要飘落任何其他的图片，直接改参数就行了
引入到博客
- 在NexT8.8中引入，先在主题配置中解除一个自定义页面的注释
hexo/_config.next.yml
custom_file_path:
header: source/_data/header.njk
- 然后引入sakura.js文件
source/_data/header.njk
<!-- 加载樱花飘飘特效 -->
<script src="sakura.js"></script>
- 如果需要修改飘落的图片，只需要在sakura.js的第三行
LoadSakura("")修改参数为图片的src即可
我这里使用的樱花图片是Base64编码的，你也可以使用其他图片的路径，例如jpg、png
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK