雪花飘落
需要先引入相关的CSS和JS文件:
<link rel="stylesheet" type="text/css" href="static/css/aui.min.css"/>
<script src="static/js/aui.min.js" type="text/javascript" charset="utf-8"></script>
<script src="static/js/aui.snow.js" type="text/javascript" charset="utf-8"></script>
示例代码
<style>
.aui-content{
background: url('static/img/image/bg.jpg') no-repeat;
background-size: 100%;
}
</style>
<div class="container">
<header class="aui-header">
<a class="aui-header-left" onclick="aui.closeWin()"><i class="iconfont iconreturn"></i></a>
<div class="aui-header-title">雪花飘落</div>
</header>
<div class="aui-content">
</div>
</div>
<script type="text/javascript">
window.addEventListener("load", function(){
aui.snows({
warp: '.aui-content',
el: '<i class="iconfont iconxuehua"></i>',
num: 100,
windowWidth: document.querySelector('.aui-content').offsetWidth,
windowHeight: document.querySelector('.aui-content').offsetHeight
});
});
</script>