Hi there ken_shoti,
here is another example that you may find of interest...
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>set a source to dead images</title>
<base href=http://codingforums.com/archive/index.php/"http://coothead.homestead.com/files/">
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
body {
background-color:#333;
color:#fff;
}
#clck {
text-align:center;
margin:20px;
cursor:pointer;
}
#img_container {
text-align:center;
}
img {
border:3px double #0f0;
}
-->
</style>
<script type="text/javascript">
<!--
var set=new Array();
set[0]='apple0.jpg';
set[1]='apple1.jpg';
set[2]='apple2.jpg';
set[3]='apple3.jpg';
set[4]='apple4.jpg';
set[5]='apple5.jpg';
var pics=document.getElementsByTagName('img');
function addImageSrc() {
for(c=0;c<pics.length;c++) {
num=c%set.length;
//IE shows img width as 28, Opera as 1 and Firefox as 0, so test for each browser
if((pics[c].width==28)||(pics[c].width==1)||(pics[c].width==0)) {
pics[c].src=set[num];
}
}
}
//-->
</script>
</head>
<body>
<div id="clck" onclick="addImageSrc()">click here to give dead images a src</div>
<div id="img_container">
<img src=http://codingforums.com/archive/index.php/"apple0.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"bad.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"rotten.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"foul.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"rubbish.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"awful.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"off.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"bad.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"rotten.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"foul.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"rubbish.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"awful.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"off.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"bad.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"rotten.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"foul.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"rubbish.jpg" alt=""/>
<img src=http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/http://codingforums.com/archive/index.php/"awful.jpg" alt=""/>
</div>
</body>
</html>
I have used onclick for the example but onload could be used. :)
coothead
TOP
