<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style type="text/css">
body{
background-color:black;
border:0px;
}
img{
position:absolute;
}
</style>
</head>
<body>
<!-- 1.给body添加样式背景色黑色
1.去掉自带8个像素外边框
2.开启定时器 每隔10毫秒执行,在定时器里面创建img,图片设置为snow.png,并添加到页面
3.给img 添加样式 修改为绝对定位
4.获取20-40随即数作为图片width
5.获取随即值left 取值范围(0-屏幕宽)并设置给img
6.添加完图片后,让图片作从顶部到底部的移动动画参考demo05移动到底部后淡出,淡出后删除图片
7.想办法让雪花的移动速度合雪花大小建立关系越小越快
-->
<script type="text/javascript" src="../js/jquery-1.4.2.js"></script>
<script type="text/javascript">
setInterval(function(){
var img=$("<img src='snow.png'>");
$("body").append(img);
var width=20+parseInt(Math.random()*20);
img.css("width",width+"px");
var ww=$(window).width();
var left=parseInt(Math.random()*ww);
img.css("left",left+"px");
var wheight= $(window).height();
img.animate({"top":wheight+"px"},1000).fadeOut(1000,function(){
img.remove();
})
},50)
</script>
</body>
</html>