1、打开Adobe Dreamweaver cs5新建一个空白网页。切换到代码页面
2、在<head>后面插入代码：<meta http-equiv=&孥恶膈茯quot;Content-Type" content="text/html; charset=utf-8" /><title>HTML5 Canvas实现动态下雪效果</title><link href="css/style.css" rel="stylesheet" type="text/css"><script type="text/javascript" src="js/jquery-1.7.2.min.js"></script><script type="text/javascript" src="js/jquery.let_it_snow.js"></script><script type="text/javascript">$(document).ready(function(){
3、继续在</head>前面插入代码：$("canvas.flare").let_it_snow({ windPower: 0, speed: 0, color: "#392F52", size:120, opacity: 0.00000001, count: 40, interaction: false }); $("canvas.snow").let_it_snow({ windPower: 3, speed: 1, count: 250, size: 0 }); $("canvas.flake").let_it_snow({ windPower: -3, speed: 1, count: 20, size: 10, image: "images/white-snowflake.png" });});</script>
4、最后在<body><body>插入：<canvas width="100%" height="100%" class="flare"></canvas> <canvas width="100%" height="100%" class="snow"></canvas> <canvas width="100%" height="100%" class="flake"></canvas>
5、预览效果
