# 前言
先载入 JQuery 库，一个用 JQuery+Html5 来实现超真实 3D 雪花飞舞的特效，该特效适合所有 web 站点
参考图片
# 在线 demo
<!DOCTYPE html> | |
<html> | |
<head> | |
<meta charset="utf-8"> | |
<title></title> | |
<style> | |
*{ | |
margin: 0; | |
} | |
body{ | |
background-image: url(https://yangbaimg.syoogame.com/tmp/000/00/00/00/5e2d330c34aa7.jpg); | |
background-position: left top; | |
background-repeat:no-repeat; | |
background-size:100% 100%; | |
background-attachment: fixed;" | |
} | |
.snow-container{ | |
position:fixed; | |
top:0;left:0; | |
width:100%; | |
height:100%; | |
pointer-events:none; | |
z-index:100001; | |
} | |
</style> | |
</head> | |
<body> | |
<!-- 雪花特效 --> | |
<script type="text/javascript" src="js/jquery-3.4.1.min.js"></script> | |
<script src="js/snow.js"></script> | |
<div class="snow-container"></div> | |
</body> | |
</html> |
# 使用方法
以 Next主题 为例
在 /root/myblog/themes/next/source/js/src 下新建 snow.js
在 /root/myblog/themes/next/layout/_layout.swig 中添加
参考图片
# 下载地址
点我下载
参考文章：JQuery+Html5 实现超真实 3D 雪花飞舞特效
