Générateur de particules jquery

Question

J'ai fait un générateur de particules avec Jquery ça fonctionne bien mais c'est un peu un CPU. Toutes les suggestions sont appréciées.

function particles() { 

$.each($('.particles'), function() { 
    if ($(this).css("opacity") == 0) { 
     $(this).remove(); 
    } 
}); 

var particleSize = Math.floor(Math.random() * 4 + 1); 

var speed = Math.floor(Math.random() * 5000 + 3000); 
var distance = Math.floor(Math.random() * 500 + 200); 
var fallOffSpeed = speed/2; 
var fallOff = distance + distance/2; 

$('body').prepend($($('<div>', { 
    "class" : "particles", 
    "height": particleSize, 
    "width": particleSize 
}).css({ 
    "background-color": "red", 
    "position": "absolute", 
    "top": Math.floor(Math.random() * 39), 
    "z-index": "-1" 
}).animate({ 
    "left": distance 
}, speed, 'linear').animate({ 
    "left": fallOff, 
    "opacity" : "0" 
}, fallOffSpeed, 'linear'))); 

setTimeout(particles, 1000); 

}

Answer 1

Je viens de créer un très petit jQuery plugin pour générer des particules d'un élément (demo)

Mon plug-in prend également l'avantage de CSS3 pour l'animation grâce à jquery.animate-enhanced

(Vous devrait être en mesure d'utiliser toile dans IE avec this kind of thing)

Answer 2

Utiliser JavaScript vanille dans un élément de toile et il volera.

par exemple: http://www.ferretarmy.com/files/canvas/canvasParticle/canvasParticle2.html