...

View Full Version : image.onLoad not firing



Ravenn
09-22-2005, 08:19 AM
I also tried onload, it's not helping either. Sources on thei nternet seem to disagree about the event name :)

The idea is to load images one after another and display a page when they are all done.
So here's the code. If we uncollmet the alert in loadPhoto, it fires one time with 0 - no further events are invoked.



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" >
<HTML>
<HEAD>


<script>

var df;
var roomId = 439;
var peopleArray = new Array();


function Person(color,userId,img,fio,reqId)
{
this.color = color;
this.userId = userId;
this.img = img;
this.fio = fio;
this.reqId = reqId;
this.photo = null;
}

function loadPhoto(n)
{
// alert(n);
peopleArray[n].photo = new Image();
if (n < (peopleArray.length-1))
{
peopleArray[n].photo.onLoad = function() { loadPhoto(n+1) };
}
else
{
peopleArray[n].photo.onLoad = addDivs;
}
peopleArray[n].photo.src = peopleArray[n].img;
}

function addDivs()
{
var l = peopleArray.length;
for (var i = 0; i < l; i++)
{
var person = peopleArray[i];
var box = document.createElement('<div class="photobox" style="background-color:'+person.color+'">');
box.id = 'box'+person.userId+'_1';
box.innerHTML = '<a href="javascript: submitform(\'Id='+roomId+'&UserId='+person.userId+'&RequestID='+person.reqId+');"><img src="http://server/app/'+person.img+'.jpg" id="img'+person.userId+'_1" style="margin: 0px; padding: 0px;" height="100"><br /><span id="fio'+person.userId+'_1">'+person.fio+'</span></a>';
df.appendChild(box);
}
var div = document.getElementById('tdiv');
div.appendChild(df);
}

function prepareLoad()
{
peopleArray[peopleArray.length] = new Person('yellow',1135,'HPIM0354','John Doe','');
/* snip */
peopleArray[peopleArray.length] = new Person('yellow',1310,'HPIM1458','John Doe 2','');
peopleArray[peopleArray.length] = new Person('yellow',1311,'HPIM5588','John Doe 3','');
}


function fillPhotos()
{
df = document.createDocumentFragment();
prepareLoad();
loadPhoto(0);
}
</script>
</HEAD>
<body style="TEXT-ALIGN: center;" onload="fillPhotos();">
<div id="container">
<div id="tdiv"></div>

</div>
</body>
</HTML>

glenngv
09-22-2005, 08:43 AM
onerror not onload is invoked because you are not passing a valid image. Why are you passing a filename with no extension?

peopleArray[peopleArray.length] = new Person('yellow',1310,'HPIM1458','John Doe 2','');



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum