I'm using JQuery Scrollables to display an image gallery, see http://www.mba-europe.de/lehr_veroff.html
In my setup, I have a .bscrollable DIV that contains a .bitems DIV that contains all the .item DIV's in analogy to .scrollable, .items and .item from the JQuery Scrollables demo page.
However, as you can see, scrolling doesn't stop as soon as the last element in the list is reached. Instead, the user can scroll further until only the last element is visible, followed by (in my case) three empty slots.
How do I avoid scrolling further, such that there are always no less than four elements visible?
Best regards, Philip
You can use scrollable's api to achive that like this;
var $scrollables = $('.bscrollable').scrollable({
size: 4,
mousewheel: true,
vertical: false,
horizontal: true
}).data('scrollable');
$scrollables.onBeforeSeek(function(e, i) {
var threshold = $scrollables.getSize() - 4;
if(i > threshold) {
e.preventDefault();
}
});