I'm creating a website for my photo retouching showing before and after photos. I've seen the Before and After plugin but I'd like for the image to fade in and out and I don't like how the slider is right on the image itself. I'd like it to be below the image. I'm actually still pretty new to jQuery but I've successfully implemented a few plugins already including the jQuery Cycle Plugin. I have some experience in merging code in Flash but still kinda stumped by the jQuery. I could make this in Flash but I like jQuery and want to learn because I think this could be done with a lot less code. 

What I'd like to do is use a UI slider (not the effect) and have the user control the FadeIn and FadeOut transitions like a volume knob where it can go back and forth with the before and after with a slow fade. Also, the ABILITY to have customized graphics (I want to create my own buttons and slider graphics but I know how to design so that isn't part of the question). There will be previous and next arrows on the left and right of the images which will then call on the next set of before and after images. 

There is a great website by retoucher Chris Tarantino which is almost exactly what I want, only they go further and added the magnification feature as well. I'm pretty sure this is all done in Flash though:

http://www.christarantino.com/

 

My guess is that I could use a slideshow like the Cycle plugin (which I've already implemented). Create a slideshow (Exp: 'slideshow1', 'slideshow2' etc) each in their own DIV for each before and after set. The arrow buttons would need the functionality to go backwards and forward from each set. Then the slider UI would control the before and after fade transition in the exact same way for each set. Preferably controlled by the milliseconds to make it look elegant. Or like in Photoshop where you can use the opacity slider where you go from 0 to 100%

If anyone could help or guide me (or correct me) in the right direction I'd definitely appreciate it. 

Thanks!!