1

所以我找到了这个有用的 jQuery 内容轮播（http://tympanus.net/Development/CircularContentCarousel/），我一直在寻找它。

我已将代码修改为从三个框显示为五个框： http ://helpmyedu.com/test/

但是，当我单击“更多”时，我不知道在哪里修改 div 的宽度 - ca-content-wrapper，以便在单击“更多”时使其全宽！

谢谢您的帮助！

更新------------------------------------- 到目前为止，我已经设法显示扩展项目正确显示，并正确关闭前三个项目...

但是，当我关闭扩展项目时，右侧的最后两个不显示原始项目（请参阅我正在谈论的链接）。

此外，在打开扩展窗口时，当我尝试向左或向右导航时会有空格....

请帮忙

4

2 回答 2

0

另外，您必须更改此代码：

switch( val ) {
case 0          : return 1; break;
case cache.itemW        : return 2; break;
case cache.itemW * 2    : return 3; break;


}

并为要在内容包装器中显示的每个项目添加一行，在这种情况下，我想显示 4 个项目，如下所示：

switch( val ) {
case 0          : return 1; break;
case cache.itemW        : return 2; break;
case cache.itemW * 2    : return 3; break;
case cache.itemW * 3    : return 4; break;

}
于 2014-04-08T15:28:00.640 回答
0

在 jquery.contentcarousel.js 中，使用 chrome developer 或者 Firebug，CTRL+F 后找到 ca-content-wrapper。

当你找到这个时，你有

openItem    : function( $wrapper, $item, opts, cache ) {
                cache.idxClicked    = $item.index();
                // the item's position (1, 2, or 3) on the viewport (the visible items) 
                cache.winpos        = aux.getWinPos( $item.position().left, cache );
                $wrapper.find('div.ca-item').not( $item ).hide();
                $item.find('div.ca-content-wrapper').css( 'left', cache.itemW + 'px' ).stop().animate({
                    width   : cache.itemW * 2 + 'px',
                    left    : cache.itemW + 'px'
                }, opts.itemSpeed, opts.itemEasing)
                .end()
                .stop()
                .animate({
                    left    : '0px'
                }, opts.itemSpeed, opts.itemEasing, function() {
                    cache.isAnimating   = false;
                    cache.expanded      = true;

                    aux.openItems( $wrapper, $item, opts, cache );
                });

            },

你可以看到：

   width    : cache.itemW * 2 + 'px',

尝试在这个 js 文件上修改这个值。

于 2013-09-25T06:58:55.757 回答