无插件HTML,无插件 HTML5 雪花特效

上代码：->

* {margin:0px;

padding:0px;}

body, html {width:100%;

height:100%; overflow:hidden;}

function jDrawSnow(){

var myCanvas =

document.getElementByIdx_x('mycanvas');

var cxt =

myCanvas.getContext('2d');

var snowcount = 200; ///

显示数量

var index = 0;

var randomNum =

0;//随机数

var zoo = 0;

var rheiNum = 0;

imageList = {}; ///

图片列表

imageSource =

['blue_glow.jpg', 'snow3.png']; /// 图片源文件类表

var snowlist = [];

/// 初始化

function init() {

/// 画布

myCanvas.width =

document.body.offsetWidth;

myCanvas.height =

document.body.offsetHeight;

zoo =

parseInt(Math.random() * 2);

if(zoo == 1){

randomNum = 0.7;

}else{

randomNum = 0.5;

}

// 加载图片

loadImages();

}

/// 加载图片

function loadImages()

{

for (var i in imageSource)

{

imageList[i] = new

Image();

imageList[i].src =

imageSource[i];

imageList[i].onload =

function () {

index++;

if (imageSource.length

>= index++) {

callImages();

}

}

}

}

function callImages()

{

for (var i = 0; i <

snowcount; i++) {

snowlist.push(new

snow());

}

setInterval(function ()

{

cxt.clearRect(0, 0,

myCanvas.width, myCanvas.height);//清空

fillBackground();//填充背景

for (var i in snowlist)

{

snowlist[i].Go();

if (snowlist[i].Y >=

myCanvas.height) {//重置雪花

snowlist[i] = new

snow();

}

}

}, 20);

}

function fillBackground()

{

cxt.drawImage(imageList[0],

0, 0, imageList[0].width, imageList[0].height, 0,0, myCanvas.width,

myCanvas.height);

}

/// 雪

function snow()

{

this.X =

parseInt(Math.random() * myCanvas.width);

if( rheiNum <=

snowcount){

this.Y =

parseInt(Math.random() * myCanvas.height);

rheiNum += 1;

}else{

this.Y = 0;

}

this.Size =

parseInt(Math.random() * 30);

this.Transparency =

10;

this.Speed =

parseInt(Math.random()*(1-10+1)+9);

}

/// 动起来

snow.prototype.Go =

function () {

this.Y  =

this.Y + this.Speed;

var xNum = 0;

if(randomNum == 0.5){

this.X = this.X + randomNum

;

xNum = 125;

}else {

this.X = this.X -

randomNum;

xNum = -125;

}

var borderLine =

imageList[1].width-55 - this.Size;

cxt.drawImage(imageList[1],

0, 0, imageList[1].width, imageList[1].height, this.X - xNum,

this.Y , borderLine , borderLine);

}

init();

}