I have some images 5 or 6 that are 800 x 300 i use in my website banner.

The start loading but when number one is 1/3 of the way teh next one starts then the next, it looks real messy nee some way to preload them ... like black square or something .... so they dont stagger like a drunk trying to load ...lol

code i used below

<script language="JavaScript">

	// configuration structure
	var A_TPL = {
		// transition duration in seconds
		'transtime': .5,
		// slide time in seconds
		'slidetime': 1,
		// width of the slide (optional)
		'width' : 800,
		// height of the slide (optional)
		'height': 300,
		// css class assigned to the <img> (optional)
		'css' : ''
	};

         // list of images to display
	var A_ITEMS = [<?php
	
	
	$directory = "banner/";
	}	
		$s_path = ($directory);
		$a_types = array ('jpg', 'jpeg');
		$a_images = array ();
		$h_dir = opendir($s_path);
		while ($s_file = readdir($h_dir)) {
			$s_type = strtolower(substr(strrchr($s_file, '.'), 1));
			if (in_array($s_type, $a_types))
				array_push($a_images, "\n\t\t'$s_path$s_file'");
		}
		closedir($h_dir);
		sort($a_images);
		echo join(',', $a_images);
?>

	];
	
         // fader initialization	
	var mySlideShow = new tFader (A_ITEMS, A_TPL);

</script>

thks

i found it .. if anyone wants to use this in future

in my javascript is a DIV called "main"
ANYTHING you want to preload either the whole page or just a section of the page use this it works relay great...

Put this on your page, I put mine just above the section i wanted to preload so it first reads this then the javascript refering to my content.
SEE DIV MAIN IN TEHRE, YOURS WILL BE NAMED SOMETHING ELSE.

<script type='text/javascript'>
	QueryLoader.selectorPreload = "main"; 
	QueryLoader.init();
</script>

after that all you need to do is pastethis at the bottom of your page and magic !

<script type='text/javascript'>
	QueryLoader.init();
</script>

And thats all there is to it ...
Hope it helps someone out there

Mike out!