Here is my take on a very simple preloaded multiple image gallery. You will need two plugins:

1. The adi_calc plugin
2. The hak_article_image plugin

The following should be placed in your page template:

<txp:article>
	<h2><txp:title /></h2>
	<txp:body />
	<txp:variable name="image" value="1" />
	<txp:variable name="thumb" value="1" />
	// Important to make two variables, otherwise the id's wont match. 
	// With 2 images uploaded, it should go like (image:#1,#2 - thumb:#1,#2) 
	// NOT (image:#1,#2 - thumb:#3,#4)

Image Gallery

	<txp:hak_article_image link="0" form="image" wraptag="ul" break="li" class="image-gallery"  />
	<txp:hak_article_thumb link="1" form="image_thumb" class="image_thumb clearfix" wraptag="ul" break="li"  />
</txp:article>

In a form called image of type misc:

<a id="<txp:adi_calc display='1' name='image' add='1' />"><txp:hak_image /></a>

In form called image_thumb of type misc:

<a href="#<txp:adi_calc display='1' name='thumb' add='1' />"><txp:hak_thumbnail /></a>

Your css

.image-gallery { display:block; overflow:hidden; width:515px; height:350px; border:2px solid #CDBFD2; margin:10px;}
.image_thumb { margin:0 0 15px 0;}
	.image_thumb li { float:left !important; margin:3px 0 0 3px; width:104px;}
	.image_thumb li a { display:block;}
	.image_thumb img { border:2px solid #CDBFD2; }

Your Jquery

<script type="text/javascript">
	$(document).ready(function(){

		$('.image-gallery li a').hide();
		$('.image-gallery li a:first').show();

		$('.image_thumb li a').click(function() {

			var toShow = $(this).attr('href');
			$('.image-gallery li a').hide();
			$(toShow).show();

			return false;
		});

	});
</script>