on click and automatic image cyclers crossfade consistentcy

on click and automatic image cyclers crossfade consistentcy

Hello guys!

I'm new to this forum and jQuery and would like to ask for your help.:) I have this code for an automatic image cycler and I really like the smoothness of the crossfade, it also works independently with identical .wrappers containing children divs:
  1. $(".wrapper").on("click", function() {
    var $content = $(this).children();

    if ($content.length > 1) {

    var $curr = $content.filter(":visible");
    var $next = $curr.is($content.last()) ? $content.first() : $curr.next();

    $next.fadeIn(2000)
    $curr.fadeOut(2000)
    }
    });
And also have this nice code for an automatic version of the cycler which allows to click-control it, but its crossfade effect looks not as as the one's above. I would like to have both versions of the cycler (on click and automatic) using the same smooth crossfade above.

The question: can someone help me make ∨this code crossfade images as smoothly as ∧this code? I would greatly appreciate any help.
  1.         $(".wrapper_auto").each(function() {
                var $this = $(this),
                    $curr = null,
                    $crossfade = $this.find(".crossfade_square");
                var zindex = -1,
                    length = $crossfade.length;

                function fadeOut() {
                    if($curr)
                        $curr.stop(true, false)
                            .fadeOut(1000, fadeIn);
                    else
                        fadeIn();
                }

                function fadeIn() {
                    ++zindex;
                    $curr = $crossfade.eq(zindex % length)
                        .fadeIn(1000)
                        .delay(5000)
                        .queue(fadeOut);
                }

                $this.on("click", fadeOut);

                fadeIn();

            });