javascript - Jquery having trouble positioning images -
follow on from:
javascript wait image load before calling ajax
function initresources() { var newimage; (i = 0; < resourcedata.length; i++) { // create image newimage = $('<img alt="big" id="imga' + + '" class="mediaimg" width="' + math.round(resourcedata[i][2] * currentscale) + '" height="' + math.round(resourcedata[i][3] * currentscale) + '" />'); newimage.load(function() { alert(i); // position $('#imga' + i).position().top(math.round(resourcedata[i][5] * currentscale)); $('#imga' + i).position().left(math.round(resourcedata[i][4] * currentscale)); }); newimage[0].src = uploadfolder + '/' + imgdata[resourcedata[i][1]][1]; $('#thepage').append(newimage); } }
i have array of images. when page loaded server, function loops through images , places them on page.
this function called when scale of page changes. scaling function clears html , redraws scale multiplier.
the problem function, alerts resourcedata.length, end of loop. need somehow pass data load function, when image load, referencing correct id/i.
you have single i
variable shared among of callbacks.
since callbacks execute asynchronously, execute after loop finishes, when i
length
.
you need put loop body separate function takes i
parameter.
way, each load
callback use separate i
variable (the function parameter), never change.
Comments
Post a Comment