javascript - 別の JCarousel 内で JCarousel を制御するにはどうすればよいですか?

Question

JCarousel の使用 現在、別のカルーセル内にカルーセルがあり、外側のカルーセルに作成した再生ボタンをクリックしてスライドの再生を開始できます。これらはすべて動的にロードされます。

クリックして外側のカルーセルのスライドを変更したときに、内側のカルーセルのアニメーションを停止して、元のロードされた位置に戻りたいと思います。

Here is what I have currently for manipulating JCarousel:
//outer carousel
$('#carousel').jcarousel({
    auto: 0,
    wrap: 'circular',
    scroll: 1,
    initCallback: carousel_initCallBack,
    itemVisibleInCallback: {
        onBeforeAnimation:  gallerycarousel_itemfirst
}

// Info Box

$('.info').click(function() {
    var itemid = $(this).attr('id').substring(5);
    $.ajax({
        url: 'php/get_case_studies.php?item=' + itemid,
        dataType: 'json',
        success: function(data) {
            var infobox = $('#box_info' + data.data[0].id)
            infobox.html('');
                var content = '<div class="main_sec">'+data.data[0].main_desc+'</div><div class="sec_sec">'+data.data[0].sec_desc+'</div><div class="visit"><span class="box_num"><img src="img/visitor.png" alt="#" /> Visitors:</span>'+data.data[0].visitors+'</div><div class="avg"><span class="box_num"><img src="img/time.png" alt="#"/> Average time on site:</span>'+ data.data[0].avg_time +'</div><a href="'+ data.data[0].url +'" target="_blank" class="link"></a>';
                infobox.append(content);
            $('.box_info').animate({left: '0px'}, 200);
        }
    });     
});

function carousel_initCallBack(carousel) {
    carousel.clip.hover(function() {
        $('.gallery_control').stop().animate({"top": "454px"}, 200);
        carousel.stopAuto();
    }, function() {
        $('.gallery_control').stop().animate({"top": "524px"}, 200);
        $('.box_info').animate({left: '-302px'}, 200 );
        carousel.startAuto();
    });

    $('#gallerycarousel_controls .btn_right').click(function() {
        carousel.next();
        return false;
    });

    $('#gallerycarousel_controls .btn_left').click(function() {
        carousel.prev();
        return false;
    });

    $('.grid').click(function() {
        $('.gallery_control').animate({"top": "524px"}, 200);
        $('#grid_view').fadeIn('slow');
        carousel.stopAuto();
        $('#grid_view').mouseleave(function() {
        $(this).fadeOut('slow');
        carousel.startAuto();
        });
    });

     $('#carousel_slides .btn_item').click(function() {
        carousel.scroll($.jcarousel.intval($(this).attr('id')));
        $('#grid_view').fadeOut('slow');
        $('.gallery_control').animate({"top": "454px"}, 200);
        return false;
    });

    //this is the play button which generates and starts the inner carousel
    $('.play').click(function() {
        var itemid = $(this).attr('id').substring(5);
        $('#int_carousel' + itemid).load('get_slideshow.php?slideshow&item=' + itemid, function() {
            $('#int_carousel' + itemid).jcarousel({
                auto: 3,
                wrap: 'circular',
                scroll: 1
            });
        });
    });
}

次のように内側のカルーセルを制御できるかどうかを確認するために、「carousel_initCallBack」関数内にクリック関数を追加しようとしました。

 $('#gallerycarousel_controls .btn_right').click(function() {
        $('#int_carousel' + itemid).stopAuto(); 
    });

上記は私が試したようには機能しません。おそらく、内側のカルーセルがスライドの元の位置に戻らないでしょう。

私は複数の異なるフォーラムに参加し、インターネット上のあらゆる場所を検索しましたが、まだ確実なヘルプやサポートを見つけることができません. オプションが不足しているため、これについての支援が切実に必要です。誰かが私を助けてくれれば、とても感謝しています。私はまだ Web 開発に不慣れで、ガイダンスが必要です。