More fun with a jQuery particle engine - lack of rotation

Question

Hey, I have a jQuery particle engine (that I'm using as an excuse to learn about easing mostly) - but the little elements won't rotate - here's my code (and a fiddle - see bottom of question):

function rotate(degree, ele) { 
    $(ele).css({ '-webkit-transform': 'rotate(' + degree + 'deg)'});  
    $(ele).css({ '-moz-transform': 'rotate(' + degree + 'deg)'});                      
    timer = setTimeout(function() {
        rotate(++degree);
    },5);
}

function particles() {
    var thisParticle;
    var particleSize = Math.floor(Math.random() * 24 + 8);
    var prependElement = $('body');
    var speed = Math.floor(Math.random() * 2000 + 900);
    var distance = Math.floor(Math.random() * 500 + 200);
    var fallOffSpeed = speed / 2;
    var fallOff = distance + distance / 1.5;
    var top = 200;      
    var rndR = Math.floor(Math.random() * 254);
    var rndG = Math.floor(Math.random() * 254);
    var rndB = Math.floor(Math.random() * 254);
    $(this).css({'background-color':'rgba('+rndR+','+rndG+','+rndB+', 1.0)'});

    $(prependElement).prepend($('<div>', {
        "class" : "particles",
        "height": particleSize,
        "width": particleSize,
    }).css({
        "background-color": "rgba("+rndR+","+rndG+","+rndB+", 1.0)",
        "position": "absolute",
        "-moz-border-radius": "1px",
        "border-radius": "1px",
        "opacity":0.75,
        "top": top,
        "z-index": "10"
    }));

    $.each($('.particles'), function () {
        var tmpEle = $(this);
        rotate(0,tmpEle);
        rndR = Math.floor(Math.random() * 254);
        rndG = Math.floor(Math.random() * 254);
        rndB = Math.floor(Math.random() * 254);
        if ($(this).css("opacity") == 0) {
            $(this).remove();
        } else {
            thisOffset = $(prependElement).height()+$(this).offset().top+(top-$(this).height());
            $(this).animate({
                "left": [distance, 'linear'],
                "top": [thisOffset, 'easeOutBounce']
            }, speed, 'linear').animate({
                "left": fallOff,
                "opacity" : "0"
            }, fallOffSpeed, 'linear');
        }
    });

    setTimeout(particles, 250);
}
$(document).ready(function() {
    particles();
});

[EDIT] @Howard solved my issue (I was missing the second argument on the setTimeout call). Next issue is why the rotation is a bit "funky".

NEW FIDDLE: http://jsfiddle.net/neuroflux/yLcaY/13/

Answer 1

The rotate within your timeout function does miss the second parameter ele.