Javascript 图像广告牌问题

我正在制作一个carouFredSel广告牌，左边是主要的大图像，右边是三个拇指，下面是导航分页

我可以让旋转木马完美地只处理图像，但我在尝试如何修改代码时遇到了问题，我可以将主图像放在DIV中，然后旋转DIV

也许我只是错过了什么

链接到jFiddle：

以下是页面内的Javascript，Jquery和CarouFredSel已经链接：

$(function() {
        var $carousel = $('#carousel'),
            $pager = $('#pager');

        function getCenterThumb() {
            var $visible = $pager.triggerHandler( 'currentVisible' ),
                center = Math.floor($visible.length / 2);

            return center;
        }

        $carousel.carouFredSel({
            responsive: true,
            items: {
                visible: 1,
                width: 746,
                height: (214/746*100) + '%'
            },
            scroll: {
                fx: 'crossfade',
                onBefore: function( data ) {
                    var src = data.items.visible.first().attr( 'src' );
                    src = src.split( '/large/' ).join( '/small/' );

                    $pager.trigger( 'slideTo', [ 'img[src="'+ src +'"]', -getCenterThumb() ] );
                    $pager.find( 'img' ).removeClass( 'selected' );
                },
                onAfter: function() {
                    $pager.find( 'img' ).eq( getCenterThumb() ).addClass( 'selected' );
                }
            },
            pagination: {
                container: '#nav'
            }
        });

        $pager.carouFredSel({
            height: '100%',
            auto: false,
            width: 300,
            items: {
                visible: 3
            },
            direction: "up",
            onCreate: function() {
                var center = getCenterThumb();
                $pager.trigger( 'slideTo', [ -center, { duration: 0 } ] );
                $pager.find( 'img' ).eq( center ).addClass( 'selected' );
            }
        });
        $pager.find( 'img' ).click(function() {
            var src = $(this).attr( 'src' );
            src = src.split( '/small/' ).join( '/large/' );
            $carousel.trigger( 'slideTo', [ 'img[src="'+ src +'"]' ] );
        });

        $('#nav').hover(function() {
            var current = $('#carousel').triggerHandler( 'currentPosition' );
            thumbs.trigger( 'slideTo', [ current, 0, true, { fx: 'none' } ] );
            $('#thumbs').stop().fadeTo(300, 1);
        }, function() {
            $('#thumbs').stop().fadeTo(300, 0);
        });

        $('#nav a').mouseenter(function() {
            var index = $('#nav a').index( $(this) );

            //  clear the queue
            thumbs.trigger( 'queue', [[]] );

            //  scroll
            thumbs.trigger( 'slideTo', [index, { queue: true }] );
        });
    });

---

我相信这就是你需要的：

---

这个问题上有悬赏，但既然我是个白痴，我就把它放在另一个问题上：收集你的代表积分。哥们！我在前面的另一个问题中看到了你的评论，请把这个答案贴在那里，然后收集你的100比索。但首先，你改变了你原来的版本吗？在这一页（）我的答案也是！我把关于变化的答案张贴在那里（）。