Jingle Bells,Jingle Bells,圣诞来临，做了一个下雪的小程序玩。有大雪花和小雪花。
<!DOCTYPE html PUBliC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<style type="text/css">
body
{
overflow:hidden;
background:#0099FF;
}
.smallSnowflake,.largeSnowflake
{
font-size:38px;
color:white;
position:absolute;
}
.largeSnowflake{
font-size:48px;
}
</style>
<script type="text/javascript">
window.onload=function(){
var snow=new Snow();
snow.start();
};
function Snow(){
this.sky=document.body;
this.width=document.documentElement.clientWidth;
this.height=document.documentElement.clientHeight;
}
Snow.prototype={
start:function(){
var _this=this;
_this.createSmallSnowflake();
_this.createLargeSnowflake();
},
createSmallSnowflake:function(){
var _this=this;
setInterval(function(){
var smallSnow=document.createElement('p');
smallSnow.innerHTML='*';
smallSnow.className='smallSnowflake';
smallSnow.style.left=Math.round(Math.random()*_this.width)+'px';
_this.sky.appendChild(smallSnow);
_this.slide(smallSnow);
},1000);
},
createLargeSnowflake:function(){
var _this=this;
setInterval(function(){
var largeSnow=document.createElement('p');
largeSnow.innerHTML='*';
largeSnow.className='largeSnowflake';
largeSnow.style.left=Math.round(Math.random()*_this.width)+'px';
_this.sky.appendChild(largeSnow);
_this.slide(largeSnow);
},2000);
},
slide:function(ele){
var _this=this;
var timer=setInterval(function(){
var t=ele.offsetTop;
ele.style.top=t+5+'px';
if(ele.offsetTop+ele.style.height>_this.height)
{
_this.sky.removeChild(ele);
clearInterval(timer);
}
},1000);
}
};
</script>
</head>
<body>
</body>
</html>
效果图：
转眼又是年末了，又要跨年了。希望新的一年所有愿望可以实现，加油。