0

我创建了一个使用 jQuery Tools 的 Scrollable 组件的网页，该页面基于最小设置演示。在这个演示中，我的页面也使用了可滚动项目，可以容纳五个缩略图，但是当我的页面第一次加载时，我只需要一个包含三个缩略图的可滚动项目，其余两个图像插槽是空的。我假设我可以简单地用一个可滚动项目 div 替换演示中的三个可滚动项目 div，一切看起来都很好，但是当我这样做时，我最终看到无法操作的左/上一个和右/下一个图标，即使有没有要滚动到的上一个或下一个可滚动项目。

我有一个我在 jsfiddle 网站上尝试做的例子。它本质上是上面引用的演示，其中不适用的可滚动项 div 和子 imgs 被注释掉了。

如何初始化可滚动项，以使页面上只有一个可滚动项，而不会出现不适用的左/上一个和右/下一个图标？

提前感谢您的帮助、建议等。

4

2 回答 2

1

我希望默认情况下隐藏浏览按钮，然后仅在需要时显示它们。

在css中，默认a.browse为visibility: hidden

然后在初始化中：

$(".scrollable").scrollable().each( function() {
  var scroller = $(this).data("scrollable");
  scroller.getNaviButtons().css('visibility', 'visible');
  if (scroller.getSize() <= 1) {
    scroller.getNaviButtons().addClass('disabled');
  }
});

这似乎有点 hacky，但如果它们不会被看到，可以避免暂时显示浏览按钮。

于 2011-11-03T14:52:10.557 回答
1

我能想到的最好的就是

if($(".scrollable .items div").length < 2) $("a.browse").hide();

初始化后。

于 2011-07-28T20:58:18.277 回答