效果展示

整体效果类似 Wallpaper Engine 的粒子特效，实现生成随机大小、位置、速度以及透明度的粒子飘落效果

demo
demo

使用

复制脚本到网站的js脚本或者能随时加载到的页面文件中（比如header或者footer）

if (typeof snow_interval !== 'undefined') clearInterval(snow_interval);
var $flake = $('<div id="snowbox" />').css({
    'position': 'absolute',
    'top': '-50px'
}).html('.')
documentHeight = $(document).height()
documentWidth = $(document).width()
minSize = 15  // 粒子最小尺寸
maxSize = 25  // 粒子最大尺寸
flakeColor = "#ffffff"  // 粒子颜色
var snow_interval = setInterval(function() {
    var startPositionLeft = Math.random() * documentWidth - 100,
        startOpacity = 0.5 + Math.random(),
        sizeFlake = minSize + Math.random() * maxSize,
        endPositionTop = documentHeight - 100,
        endPositionLeft = startPositionLeft - 100 + Math.random() * 100,
        durationFall = documentHeight * 10 + Math.random() * 5000;
    $flake.clone().appendTo('#banner').css({  // 特效作用于#banner
        left: startPositionLeft,
        opacity: startOpacity,
        'font-size': sizeFlake,
        color: flakeColor
    }).animate({
        top: endPositionTop,
        left: endPositionLeft,
        opacity: 0.2
    }, durationFall, 'linear', function() {
        $(this).remove()
    });
}, 1000);

若不想在一些位置显示，加入以下脚本即可

if(typeof snow_interval !== 'undefined') clearInterval(snow_interval);