Hi there,

My first post in the jQuery/Zoho forums, so bear with me :)

I've built a homemade plugin/function to display a bunch of images as a slideshow.
The code is below this message. The images are in an array (imgArray). I have have
a.previous and a.next links for the navigation. Only if the user clicks the links again
while the image is still fading, it already changes the SRC and then does the fade
effect. It kind of looks like flickering.

Is there any way to stop/prevent this flickering?

Hope it kind of makes sense.

Thanks,
Knal

1. switchSlide: function() {
   
       var t             = $(this).closest( "div.project" ).attr( "id" )
   
       var cur_img     = $.inArray( $( "#" + t + " div.morebody div.slides img:first" ).attr( "src" ), imgArray )
       var new_img     = ( $(this).parent().attr( "class" ) == "previous" ) ? cur_img-1 : cur_img + 1
   
       var prev_img     = new_img - 1
       var next_img     = new_img + 1
      
       var prev_link    = ( prev_img >= 0 ) ? "<a href=\"" + imgArray[ prev_img ] + "\" title=\"" + slide_nav_prev_title + "\" >" + slide_nav_prev + "</a>" : "<span>" + slide_nav_prev + "</span>"
       var next_link    = ( next_img <= imgArray.length - 1 ) ? "<a href=\"" + imgArray[ next_img ] + "\" title=\"" + slide_nav_nxt_title + "\" >" + slide_nav_nxt + "</a>" : "<span>" + slide_nav_nxt + "</span>"
   
       $( "#" + t + " div.morebody div.slides img:first, #"+t+" div.morebody div.slides_nav span.cur_img" ).animate( {opacity: 0}, 500, function(){
   
           $( "#" + t + " div.morebody div.slides_nav span.cur_img" ).html( ( new_img + 1 ) ).animate( {opacity: 1}, 500 )
           $( "#" + t + " div.morebody div.slides img:first" ).attr( "src", imgArray[t][ new_img ] ).animate( {opacity: 1}, 1000 )
          
       })
   
   }