Hi!
I'm pretty sure this is the right place for this and I'm hoping you can help me with this.

I've decided to create a website to showcase my photography. I've managed to create the slideshow but adding effects and stuff to it is a little trickier to me.

I started this project almost a week ago and before that I had next to no experience apart from customizing html on tumblr etc.

Now what I want to do is to add an image counter just like the example on malsup's site. And! But that is of lesser priority, to add a thumbnail gallery linking to what I have now. Similar to this but linking to the slider which I have now instead of having an image to the right.

I have the scripts Jquery 1.8 and cycle all loaded and then this is what I have chalked down so far.

Script:

$('#s1').cycle({
fx: 'fade',
speed: 'fast',
timeout: 0,
next: '#next2',
prev: '#prev2',
});

Html:

<div id="s1" class="pics">
<img src="http://davidjohanssonphotography.com/images/slide1.jpg" />
<img src="http://davidjohanssonphotography.com/images/slide2.jpg" />
<img src="http://davidjohanssonphotography.com/images/slide3.jpg" />
</div>
<div class="nav">
<h3><a id="prev2" href="#">Prev</a>/<a id="next2" href="#">Next</a></h3>
</div>

Could someone please give me a simple explanation on how to do this in a simple way?

I will be ever so grateful!