动画效果很是炫酷，那你们用面对对象做过一些动画么。
今天就来瞧瞧利用面对对象来做的雪花飘落吧！
首先呢我们先在页面上创建一个div标签，让他占满这个页面，之后在这个div 里面用面对对象创建出雪花，然后给对象添加属性与方法。
快来看看代码吧！
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> *{ margin: 0; padding: 0; } </style> </head> <body> <div id="img" style=" 100%;height: 100%"> <img src="2010011711303711.bmp" style=" 100%;height: 625px"/> </div> <script> function Div(){ //创建一个雪花图片 this.div = document.createElement("img"); //设置一个随机数 var size=Math.floor(Math.random()*(30-10+1)+10); //设置雪花的随机大小 this.height = size; this.width = size; //设置雪花的随机位置 this.x = Math.random()*1300+"px"; this.y = Math.random()*600+"px"; //将一些样式添加给雪花 this.createDiv = function(){ this.div.style.height = this.height+"px"; this.div.style.width = this.width+"px"; this.div.style.left = this.x; this.div.style.top = this.y; this.div.src="snow1.png"; this.div.style.position = "absolute"; document.getElementById("img").appendChild(this.div); } } //给Div的原型添加一个dow属性 Div.prototype.down = function(){ var y=parseInt(this.y); var self=this; setInterval(function(){ if(y>600){ self.div.remove(); }else{ self.div.style.top = y++ +"px"; } },10); }; var fuc = function(){ var div = new Div(); div.createDiv(); div.down(); }; // 设定计时器，让雪花每隔0.1s随机飘落 setInterval(fuc,100); </script> </body> </html>
效果图：
