I have a gallery with on big image, and small thumbnails. And when I click on one of the small thumbnails the big image should be replaced with a big image version of the small thumbnail I clicked on.

For that I have a little javascript function that I got working, but the problem I have now is that I can't get it to replace the big image version of the thumbnail you clicked on, it just replace the big image with the thumbnail size you have clicked on.

could somebody help me out with this?
I'm open for other suggestion on how to do this if there are any..

Javascript code:

<script type="text/javascript">
      function chgBigImg( img ){
         var bigImg = document.getElementById( "Big-img" );
         var src = img.src;
	
         bigImg.src = src;
}
</script>	

<% control Attachment %> 
   <% control SetWidth(470) %> 
      <img src="$URL" alt="$Title" id="Big-img" />
   <% end_control %> 
<% end_control %>

<% control Attachment %> 
   <% control SetWidth(70) %> 
      <img src="$URL" alt="$Title" onclick="chgBigImg(this); return false;" />
   <% end_control %> 
<% end_control %>

Using SetWidth(70) creates a new (thumbnail) image resampled to that size, instead of the original. So what you're doing is setting your Big images' source to the same as the thumbnail, not the the original. You probably don't want to have every thumbnail as a full sized image resized (e.g. call the original file and use css; style="width:70px"), so you'll have to query the server again to reload and get new image, either using the thumbnail as a link back to the server, or creating some ajax.

"call the original file and use css; style="width:70px"), "

That's what I originaly did, it works but when the images are being sized down that much they get really nasty looking (can't think of a better word for it).

"so you'll have to query the server again to reload and get new image"

How do I do that?
Have been trying this all day but my javascript skills are very limited...

Why not use an existing plugin for jQuery? Something like this:
http://devkick.com/lab/galleria/demo_01.htm

.. and here's the documentation on how to implement it (scroll down to "Usage" section):
http://devkick.com/lab/galleria/

Just make sure your template generates code that's usable for the plugin. Something like this:

<ul class="gallery"> 
<% control Attachment %>
<li><a href="$SetWidth(470).Link" title="$Title">$SetWidth(70)</a></li> 
<% end_control %>
</ul>

Thanks.. going to see if I can make this work :)

Trying to add the galleria, but I only get "jQuery is not defined" error.
Have followed the "Usage" section but can't get this to work...

Did you download and include jQuery?
You could also include the jQuery bundled with SilverStripe:

<script type="text/javascript" src="jsparty/jquery/jquery-packed.js"></script> 
<script type="text/javascript" src="jquery.galleria.js"></script> 
....

Yes, downloaded all of them and tried them.

Have tried the jQuery bundled with SilverStripe to..