基本上,我正在尝试修复 Jquery Tools 1.2.6 Scrollable 的奇怪习惯,即如果项目的数量没有按滚动大小均匀划分,则滚动过去最后一个项目。
换句话说,如果我有一个包含 11 个项目的小部件,并且它设置为一次显示 2 个,并且每次单击下一个按钮以滚动到下一个 2 个项目时,当涉及到第 11 个项目时,它将滚动,所以第 11 个显示,但在第 12 个项目所在的右侧有一个空白区域。尽管没有第二项,但基本上将下一个 2 滚动到视图中
在这里,我有一个 jsFiddle 来演示我的修复:http: //jsfiddle.net/natepers/6kmuE/21/
scroll-size
我设法通过将剩余的项目数重置为小于scroll-size
;来让它停在最后一个项目上。
问题是我无法让它回到第一个项目。
这是javascript:
var scrollable = $(".scrollable").data("scrollable");
var size = scrollable.getConf().size;
// Catch any requests for items at the end of the list
scrollable.onSeek(function(event, index) {
var self_size = this.getSize();
// Last vsisible item
var last = index + size;
// How many to the last item
var difference = self_size - last;
// How many more than the scroll size
var remainder = index%size;
//reset scroll size for each request
scrollable.getConf().size = size;
// If next request has items but less than the scroll size
if ( remainder == 0 && difference < size && difference > 0 ) {
// Set the scroll size to th enumber of items left
scrollable.getConf().size = difference;
}
//If we're at the end
if (index++ === self_size - size) {
// Set disabled style on next button
$("a.next").addClass("disabled");
}
//If the items are not evenly divided by the scroll size we know we're at the end
if (remainder != 0) {
// Set scroll size to the what's left
scrollable.getConf().size = remainder;
}
});
// Stop scrolling at last item
scrollable.onBeforeSeek(function(event, index) {
var self_index = this.getIndex();
var self_size = this.getSize();
var last = self_index + size;
//If the last visible item is the last item
if (last == self_size) {
// If the next requested item is >= the last item do nothing
if (index > self_index) { return false; }
}
});
感谢您的任何建议或帮助。