jQuary实现背景飘雪效果

css样式：

body{

    padding: 0;

    margin: 0;

    overflow: hidden;

    background: #000;

}

JS代码：

var flackColor = "#fff"; //雪片颜色

var newOne = 10;//间隔10毫秒

var flake = $( "<div></div>"). html( "❄"). css( "position", "absolute");

$( function(){

setInterval( function(){

var dWidth = $ ( document ). width (); //获取页面宽度

var dHeight = $( document). height();//获取页面高度

var startLeft = dWidth* Math. random();//雪片随机出现位置

var endLeft = dWidth* Math. random();//雪片随机结束位置

var flakeSize= 5+ 50* Math. random();//雪片大小

var durationTime= 4000+ 7000* Math. random();

var startOpacity= 0.7+ 0.3* Math. random();//出现时雪片透明度

var endOpacity= 0.4+ 0.3* Math. random();//消失时图片透明度

flake. clone(). appendTo( $( "body")). css({

"left" :startLeft,

"top" : "-55px",

"opacity" :startOpacity,

"font-size" :flakeSize,

"color" :flackColor,

}). animate({

"left" :endLeft,

"top" :dHeight,

"opacity" :endOpacity

}, durationTime, function(){

$( this). remove();

})

}, newOne);

})