how to implement slideshow transition effects?

Question

I think in transition effects in slideshows,just two animation methods of fade in and fade out are ready to use,others have to be implemented by css,am I right?if not,please give examples,if yes,guide me how can I implement some of them,or have anyone done it before?

Answer 1

The fadeIn() and fadeOut() are the easiest to use but they are just shortcuts to jquery's animate function. These use css, just like all the other animations including custom one's, you just don't have to deal with it directly.

In jQuery you can use the animation function to transition any css value that has a numeric value (height,width,top,left,etc.) For more complex built-in methods you can try the jQuery UI library.

An example:

$('#myDiv').animate({height:30,width:300,top:400,left:300});

See the jQuery animate documentation for more details.

I have also built my own jQuery slider which you can find here. Going into the source code may give you more information as it deals heavily with animating the position and size of images.

Hope this helps.