您的位置:首页 > 其它

网页雪花背景特效

2017-02-25 00:00 260 查看
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="js/jquery.js" type="text/javascript" charset="utf-8"></script>

<style>
*{
margin: 0;
padding: 0;
}
body{
background: #000;
}
</style>
</head>
<body>

</body>
<script type="text/javascript">
var minSize = 5;
var maxSize = 20;
var newOne = 200;
var fColor = '#fff';
var flak = $('<div></div>').css({
'position':'absolute',
'top':'50px'
}).html('∗');
$(function(){
var dh = $(document).height();
var dw = $(document).width();
setInterval(function(){
var sPl = Math.random()*dw;
var sO = 0.7 + Math.random()*0.3;
var ePt = dh;
var eOl = Math.random()*dw;
var dur = 5000+Math.random()*3000;
var sSize = minSize + maxSize*Math.random();
flak.clone().appendTo('body').css({
'left':sPl,
'opacity':sO,
'font-size':sSize,
'color':fColor
}).animate({
'top':ePt,
'left':eOl,
'opacity':0.5
},dur,function(){$(this).remove()});//清除div防止过多
},newOne);
});

</script>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: