5

我正在使用 jQuery Tools 可滚动的轮播，一次查看三个项目，并以自动滚动和循环方式滚动一个项目。

我已经使用 CSS 来显示这三个项目。在轮播到达最后一个项目之前，这可以正常工作，它似乎要等到它经过它才能加载以下项目。

在显示最后一个项目之前，它似乎也要等到中间项目完全显示。

在这里演示：http: //jsfiddle.net/pgxSm/6/

对此我能做些什么吗？

4

3 回答 3

9

是的你可以。我也有同样的问题。

  1. 包含项目的元素需要具有非常大的宽度。尝试像这样添加 CSS：

    .items {
    width: 20000em;
}

    实际上，这是使 jQuery Tools Scrollable 正常工作的要求之一，如开发人员的演示页面所述。这样，所有项目都可以显示在一行中，以便在滚动时最后一个项目之后没有可见空间。它是否比需要的大并不重要，只要它永远不会太小。

  2. jQuery Tools Scrollable 实际上是为一次只显示一项而构建的。这意味着您必须更改脚本的代码：

    您可以在此处找到未缩小的脚本。在 Scrollable 脚本中搜索显示的行

    cloned2 = self.getItems().eq(1).clone().appendTo(itemWrap);

    用这一行替换它：

    cloned2 = self.getItems().slice(1,4).clone().appendTo(itemWrap);

    这样，您可以克隆前 3 个项目（而不仅仅是第一个项目）并将其添加到项目的末尾，这样即使一次可见多个项目，也可以进行循环滚动。如果您希望一次显示更多项目，只需替换4为[number of visible items] + 1. Afaik，没有其他方法可以让 jQuery 工具同时处理多个可见的项目。我也在工作中使用这个解决方案。

    如果您想再次获得脚本的缩小版本，在您更改后，只需使用此minifier。它就像一个魅力。:)

如果这是您要查找的内容，请考虑将其标记为正确答案。谢谢！

于 2012-05-02T19:04:22.693 回答
2

上面的答案在技术上是正确的，但是，如果你是从 jQuerytools 网站捆绑下载它，它的措辞会略有不同。

您可能正在寻找的行是：

l = f.getItems().eq(1).clone().appendTo(h);

应该以与上述答案类似的方式更改为：

l = f.getItems().slice(1,4).clone().appendTo(h);

未经全面测试，使用风险自负。

于 2012-12-07T14:24:54.510 回答
1

如果您想使其可配置，只需添加

circularVisibleItems:1

变成conf对象然后改变

l=f.getItems().eq(1).clone().appendTo(h);

进入

l=e.circularVisibleItems>1?f.getItems().slice(1,e.circularVisibleItems+1).clone().appendTo(h):f.getItems().eq(1).clone().appendTo(h);

比您可以定义必须在哪个滑块中克隆多少项目。

于 2013-08-03T09:56:32.787 回答