<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script src="/jquery/1.11.1/jquery.min.js"></script>
<title>圣诞下雪</title>
<style>
body{background:#000;margin:0;padding:0;}
.snow{position:fixed;top:0;color:#fff;z-index:99999999;}
</style>
<script>
$(function(){
var wh=$(window).height();
setInterval(function(){
var f=$(document).width();
var e=Math.random()*f-100;//雪花的定位left值
var o=0.3+Math.random();//雪花的透明度
var fon=10+Math.random()*30;//雪花大小
var l = e - 100 + 200 * Math.random();//雪花的横向位移
var k=2000 + 5000 * Math.random();
var html;
switch(Math.floor(Math.random()*3+1)){
case 1:
html = "<div class='snow'>a<div>";
break;
case 2:
html = "<div class='snow'>b<div>";
break;
case 3:
html = "<div class='snow'>?<div>";
break;
}
$(html).clone().appendTo("body").css({
left:e+"px",
opacity:o,
"font-size":fon,
}).animate({
top:(wh*2)+"px",
left:l+"px",
opacity:0.1,
},k,"linear",function(){$(this).remove()})
},100)
})
</script>
</head>
<body>
<div style="width:100%; height:3000px; background:#009966;"></div>
</body>
</html>
本文暂时没有评论,来添加一个吧(●'◡'●)