网页雪花背景特效
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>
<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>
相关文章推荐
- 雪花背景网页特效
- 非常Cool的 网页特效(背景藏,alert样式)
- jquery+css3实现网页背景花瓣随机飘落特效
- jQuery和CSS3网页固定背景视觉差特效插件
- CSS3网页固定背景视觉差特效
- 网页粒子特效背景 Particleground.js 的简单引入
- 新浪的网页背景特效,可以关闭不显示
- [HTML 5] 辐射式伞状网页背景特效代码下载与使用
- 网页特效-背景特效-简单实用的下雪背景
- 网页特效:Rgb to hex 背景颜色代码生成
- jquery+css3实现网页背景花瓣随机飘落特效
- 网页 滚屏特效,用flash做背景,定时滚动,ccs背景代码效果语法,使用CSS处理表格边框样式化
- 最新网页特效-时钟是在背景上显示
- 网页中加入下雨的效果背景特效
- 按照上下午或不同时间段显示不同网页背景的js特效
- 网页特效-窗口特效-弹出窗口后网页背景变暗的效果
- 电脑全屏雪花飘落的背景特效
- jQuery网页背景灯光闪烁特效
- 动态更换网页的背景图
- 发现一个好玩的东东【散漫粒子】【网页背景线条】