代码如下：
<script type="text/javascript" src="jquery.min.js"></script> <script src="jq.snow.js"></script> <!--下面是调用方法和参数说明--> <script> $(function(){ $.fn.snow({ minSize: 5, //雪花的最小尺寸 maxSize: 50, //雪花的最大尺寸 newOn: 300 //雪花出现的频率 这个数值越小雪花越多 }); }); </script>
首先要引用Jquery库，到Jquery官网下载
jq.snow.js代码：
/** * js网页雪花效果jquery插件 * * */ (function($){ $.fn.snow = function(options){ var $flake = $('<div id="snowbox" />').css({'position': 'absolute', 'top': '-50px'}).html('❄'), documentHeight = $(document).height(), documentWidth = $(document).width(), defaults = { minSize : 10, //雪花的最小尺寸 maxSize : 20, //雪花的最大尺寸 newOn : 1000, //雪花出现的频率 flakeColor : "#267aba" //雪花的颜色 }, options = $.extend({}, defaults, options); var interval = setInterval( function(){ var startPositionLeft = Math.random() * documentWidth - 100, startOpacity = 0.5 + Math.random(), sizeFlake = options.minSize + Math.random() * options.maxSize, endPositionTop = documentHeight - 40, endPositionLeft = startPositionLeft - 100 + Math.random() * 500, durationFall = documentHeight * 10 + Math.random() * 5000; $flake.clone().appendTo('body').css({ left: startPositionLeft, opacity: startOpacity, 'font-size': sizeFlake, color: options.flakeColor }).animate({ top: endPositionTop, left: endPositionLeft, opacity: 0.2 },durationFall,'linear',function(){ $(this).remove() } ); }, options.newOn); }; })(jQuery);
将这个引用到网站的页面上就可以了，如下：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>为网站增加js网页雪花效果jquery插件，特别适合圣诞/元旦/新年网站气氛 - 懒人建站</title>
<script type="text/javascript" src="jquery.min.js"></script>
<script src="jq.snow.js"></script>
<!--下面是调用方法和参数说明-->
<script>
$(function(){
$.fn.snow({
minSize: 5, //雪花的最小尺寸
maxSize: 50, //雪花的最大尺寸
newOn: 300 //雪花出现的频率 这个数值越小雪花越多
});
});
</script>
</head>
<body>
</body>
</html>