I built a small website for friend of mine. It is all about pictures. The pictures are shown in a thumbnail. I created a small script, that shows a "loading circle" first and changes the src of this image to the actual thumbnail, after the page is loaded. My problem is, that when you first meet the website, not all of the loading circles will be replaced with the actual thumbnail. You need to reload the page 1-2 times and then you can see all the thumbnails. I have no idea, why this is happening It is really annoying and makes the website look very unprofessional. Do you have any idea how I can force the website to load all thumbnails? Here is one page of the website itself:


Here is a picture of the incomplete loading:

Here is the HTML-Code for the loading circle:
<a title='' rel='gallery_group' href='Pic/nord/sized/20120225-IMG_6393.jpg'><img data-src='Pic/nord/thumb/20120225-IMG_6393.jpg' src='images/blank.png' alt=''></img></a>
And here is the code, that changes the src to the actual thumbnail:
function neueSrc () {
var all = document.getElementsByTagName("img");
	for (var i=0, max=all.length; i < max; i++) {	
		 all[i].src = all[i].getAttribute('data-src');
The code is executed, when the page is loaded:
<body id="top" onload="neueSrc()">
I am very greatful for any help

Thank you very much,