function preloadimages() {
		
		var allimg = new Array;
		var preimg = new Array;
		allimg = document.images;
		for (i=0; i<allimg.length; i++) {
			var ts = allimg[i].src;
			var file = ts.substring(ts.lastIndexOf('/') + 1,ts.length);
			//alert(file);
			if ( file.match(/^\d\d?_/) ) { // bug - this preloads the first large image twice :-(
				var tb = ts.substring(0,ts.length - 5);
				preimg.concat(tb + '1.jpg', tb + '2.jpg');
			}
		}
		
		doPreload(preimg);
		
	}
	
	function doPreload(a) {
	
		for (j=0; j<a.length; j++) {
			(new Image).src = a[j];
		}
			
	}

	function getIndexFromThumb(t) {

		var s = t.src.toString();
		var file = s.substring(s.lastIndexOf('/'),s.length);
		n = file.substr(1,2);
		//alert(n);
		return n;

	}

	function switchThumb(i) {
	
		var image_1 = new Image;
		var s = i.src.toString();                                 // e.g. .../images/binary_0.jpg
		var b = s.substring(0,s.length - 5);                      // e.g. .../images/binary_
		var t = parseInt(s.substring(s.length - 4,s.length - 5)); // should be 0 or 1
		t = (t+1) % 2;                                            // toggle between 0 and 1
		image_1.src = b + t.toString() + '.jpg';                  // e.g. .../images/binary_1.jpg
	
		i.src = image_1.src;
		
	}
	
	function switchCaption(t) {
	
		var myel = document.getElementById('caption');
		myel.innerHTML = captions[ getIndexFromThumb(t) - 1 ]; // since zero-indexed
		
	}
	
	function switchLargeImage(t) {
	
		var s = t.src.toString();
		var b = s.substring(0,s.length - 5);
		var mymainimage = document.getElementById('mainimage');
		mymainimage.src = b + '2.jpg';
		
	}
	
	function handleMouseOver(t) {
	
		// switch thumb to color
		switchThumb(t);
		
		// switch caption
		switchCaption(t);

		// switch main image
		switchLargeImage(t);
	
	}

	function handleMouseOverNoCaption(t) {
	
		// switch thumb to color
		switchThumb(t);
		
		// switch main image
		switchLargeImage(t);
	
	}
	
	function handleMouseOut(t) {
	
		// switch back thumb
		switchThumb(t);
		
	}