Question

My debugging skills are not helping me much with figuring out what I am doing wrong here.

I want each element in an array to animate after a specified time using setTimeout function.

I am not getting any errors and the loop appears to run just fine, however, none of the elements in the array end up moving from their original place to the new spot.

function publicity()
{
// placing elements with class name 'cCameras' inside an array
var eCamerasArray = $(".cCameras").toArray();
// creating 2 arrays to hold left & top values of each element
var iLeftPosArray = [];
var iTopPosArray = [];
// loop to run through each element in array
for( var i = 0; i < eCamerasArray.length; i++)
{
    // timer variable set for each element to be used in setTimeout func.
    var timer = Math.floor (Math.random()*300) + 100;
    // setTimeout func. used to animate each element after a specified (timer) time
    window.setTimeout (function ()
    {
        iLeftPosArray[i] = Math.floor (Math.random() *139) + 360;
        iTopPosArray[i] = Math.floor (Math.random() *160) + 100 ;
        $(eCamerasArray[i]).animate ({left: iLeftPosArray[i] + "px", top: iTopPosArray[i] + "px"}, 100, "linear");
        return [iLeftPosArray[i], iTopPosArray[i]];
    }, timer);
}
}

Answer 1

You can fix it with creating closure:

(function publicity() {
    var eCamerasArray = $(".cCameras"),
        iLeftPosArray = [],
        iTopPosArray = [],
        timer;
    for(var i = 0; i < eCamerasArray.length; i += 1) {
        timer = Math.floor (Math.random() * 300) + 100;
        (function (i) {
            window.setTimeout (function () {
                iLeftPosArray[i] = Math.floor (Math.random() * 139) + 360;
                iTopPosArray[i] = Math.floor (Math.random() * 160) + 100 ;
                $(eCamerasArray[i]).animate ({left: iLeftPosArray[i] + "px", top: iTopPosArray[i] + "px"}, 300, "linear");
                return [iLeftPosArray[i], iTopPosArray[i]];
            }, timer);
        }(i));
    }
}());

You can see the effect here: http://jsfiddle.net/zHUAt/2/

Best regards!