Jquery 工具和可滚动答案

【问题标题】：Jquery Tools & ScrollableJquery 工具和可滚动
【发布时间】：2010-09-07 14:02:31
【问题描述】：

导航器插件和历史设置为 true 时可滚动。这样用户就可以使用 id'd 链接滚动到可滚动列表中他们选择的选项（大约 50 个项目）。我已将循环设置为 true。

项目以 4 个为一组显示。但上一个和下一个按钮仅移动 1 个项目，而我希望它们移动 4 个项目。我该怎么做？

我无法将它们分组到 div 页面中，因为索引选项卡列表会匹配这些 div 页面而不是包含的项目。

我尝试使用 api.move(-2) 创建一个点击处理程序，但是会发生各种奇怪的事情（不先于原生滚动一个；倒退而不是前进，或者前进然后倒退一个序列 - 不可接受）。

我显然缺少一些基本的东西。指针将不胜感激。

谢谢，

亨里克

【问题讨论】：

标签： javascript jquery-tools

【解决方案1】：

这就是我最终做的事情：我抓住了 api 并替换了 next 和 prev 函数；禁用通告；添加了第一个和最后一个按钮。一种解决方法/半解决方案。你可以在http://cityrinks.ca/wiki/wiki.php?n=ListOfRinks.TableOfRinks看到结果

$(function() {
$(".scrollable")
     .scrollable({
        vertical: true, 
        mousewheel: true,
        circular:false 
     })
     .navigator({
    navi: "#rinktabs",
    naviItem: 'a',
    activeClass: 'current',
    history: false
      });
var api = $(".scrollable").data("scrollable");
api.next = function(time) {
index = this.getIndex();
size = this.getSize();
interval = size - index;
if (interval > 4) interval = 4;
return this.move(interval, time);
};
api.prev = function(time) {
index = this.getIndex();
if (index > 4) index = 4;
return this.move(-index, time);
};
$("#firstbutton").click(function() {
var api = $(".scrollable").data("scrollable");
return api.begin(api.speed);
});
$("#lastbutton").click(function() {
var api = $(".scrollable").data("scrollable");
return api.end(api.speed);
});
});

【讨论】：