Question

For a project I would like to make a content banner that would switch between several "slides" (containing html, images etc). The "slides" are div elements. The slideIn effect used by jCarousel isn't what the guy wants, he wanst it to fadeIn/fadeOut the "slides" with each "slide" shown for 7 seconds.

Anyone know of a plugin that can achieve this?

P.s. I have tried to ask if anyone has created a fadeIn/fadeOut effect for jCarousel but the question hasn't had any response, so now I am willing to change the plugin for one that does this specific task.

Was it helpful?

Solution

Have you seen the jQuery Cycle Plugin? It has a ton of different options, one of which is a fade effect. Just download the plugin code and then use the following

$(function() {
  $('div.slideshow').cycle({
    fx: 'fade', // choose the fade transition type
    timeout: 7000 // 7 second delay between fade in and fade out
  });
); 

assuming your images are all sized the same and in a <div> with class="slideshow"

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top