I'm trying to pass arguments to a function that's called from within anonymous function that acts as an event handler for the click event. The problem is that once a thumbnail(gallery.images[i]) is clicked the startSlideshow function gets the final iteration's values passed as the arguments, instead I would like for it to get the values(filename, folder, width, height) of the loop iteration it was created in.
The code in question is: $(_gallery.images[i]).click(function(){ slideshow.startSlideshow(filename, "img/gallery/" + _gallery.subpage + "/", w, h) }); ...the whole loop: for(i=0; i<_gallery.numThumbs; i++){ node = $(_gallery.xmlFileList).find ("picture").get(i); filename = $(node).attr("filename"); w = $(node).attr("width"); h = $(node).attr("height"); tmbDim = slideshow.scaleFactoring (w,h,tmbPlaceW,tmbPlaceH); tmbW = Math.round(tmbDim[0] * 0.85); tmbH = Math.round(tmbDim[1] * 0.85); _gallery.images[i] = new Image(); $(_gallery.images[i]).addClass("galleryTmb"); $(_gallery.images[i]).load( function(){ $(this).css({"top": Math.round($ (this).parent().height() / 2 - $(this).outerHeight() / 2)}); $(this).css({"left": Math.round($ (this).parent().width() / 2 - $(this).outerWidth() / 2)}); $(this).data("mydim", {w:$(this).width(),h: $(this).height(),ow:$(this).outerWidth(),oh:$(this).outerHeight()}); pulseTmb(this); }); $(_gallery.images[i]).click(function(){ slideshow.startSlideshow(filename, "img/ gallery/" + _gallery.subpage + "/", w, h) }); currDiv = document.createElement("div"); $(currDiv).addClass("tmbPlace"); $(currDiv).width(tmbPlaceW); $(currDiv).height(tmbPlaceH); $(currDiv).append(_gallery.images[i]); $("#divPicPanel").append(currDiv); _gallery.images[i].src = "thu.aspx?img=" + filename + "&w=" +tmbW + "&h=" + tmbH +"&path=img/gallery/" + _gallery.subpage + "/"; } Sorry for poor english(I've been at javascript for 8hrs straight), please help.