2015-05-22 17:11:09
今天我来给大家介绍一种网页特效,这种网页特效是是背景出现下雪的效果,非常的绚丽。如果说下雪不太适合自己的网页,需要飘落一些花瓣或心之类的,那么同样可以使用这个特效,只填一张图片即可实现,废话就不多说了,直接了看代码吧。
代码语言:javascript复制<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>网页下雪特效--落帆亭</title>
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
<script src="js/jq.snow.js"></script>
<!--下面是调用方法和参数说明-->
<script>
$(function(){
$.fn.snow({
//Container:'.aixin',//这里是你想在哪个元素处出现雪花,这里可以是class也可以是id
minSize: 5, //雪花的最小尺寸
maxSize: 50, //雪花的最大尺寸
newOn: 300 //雪花出现的频率 这个数值越小雪花越多
//content:'<img src="images/xin.png" style="width:100%">',//这里是你想用的图片,如果不写这行代码,则默认为雪花
// documentHeight :$(".aixin").height(),
// documentWidth :$(".aixin").width(),
// flakeColor : "#ff2727"
});
});
</script>
</head>
<body style="background:#3B3B3B; color:#ccc;">
<div style="text-align:center;margin: 0;padding:0; font:normal 14px/24px 'MicroSoft YaHei';">
</div>
</body>
</html>
这就是简单的在html代码里调用下雪的这个特效,当然这个效果并不是这么简单,还需要有一点点的js控制,这里我将他封装在了一个js文件里,只需要在使用时引入即可。本站提供下载链接和演示效果,有兴趣的朋友可以看一下。
在线预览链接:预览,下载的话从预览里面直接从socure目录里下载吧