preload images before render javascript -

i wanna display images instantly images loaded smooth slider, not working.

var myphotos = {     _counter: 0,     images: [],     init: function() {         servercall1(0, 'xml', 'rssphotos.php', function(xml) {             imageobj = new image();             $(xml).find('item').each(function() {                 var desc = $(this).find('description').text();                 var resp = getimgarray(desc);                  myphotos.images[myphotos._counter] = resp[0];                 myphotos._counter++;              });              //start preloading             (i = 0; < myphotos._counter; i++) {                 imageobj.src = myphotos.images[i];             }              ////put header home page             topheader.putdata(topheader.photodata());         });     }  }; 

after execution of function, loop through myphotos.images them instantly, rendering 1 one slowly.

perhaps this

var myphotos = {     _counter: 0,     images: [],     init: function() {         servercall1(0, 'xml', 'rssphotos.php', function(xml) {             $(xml).find('item').each(function() {                 var desc = $(this).find('description').text();                 var resp = getimgarray(desc);                  myphotos.images[myphotos._counter] = resp[0];                 myphotos._counter++;              });              //start preloading             (i = 0; < myphotos._counter; i++) {                 this.images[i]= new image(); this.images[i].src = myphotos.images[i];             }              ////put header home page             topheader.putdata(topheader.photodata());         });     }  };