Разобрался. Переделал скрипт:
$('.button').click(function() {
var scrollAmount = $(this).prev().width() - $(this).prev().parent().width();
var currentPos = Math.abs(parseInt($(this).prev().css('left')));
var remainingScroll = scrollAmount - currentPos;
// Scroll half-a-screen by default
var nextScroll = Math.floor($(this).prev().parent().width() / 2);
// But if there isn’t a FULL scroll left,
// only scroll the remaining amount.
if (remainingScroll < nextScroll) {
nextScroll = remainingScroll;
}
if (currentPos < scrollAmount) {
// Scroll left
$(this).prev().animate({'left':'-=' + nextScroll}, 'slow');
}
else{
// Scroll right
$(this).prev().animate({'left':'0'}, 'fast');
}
});
Также изменил
<div id="next">next</div>:
...
<div id="next1" class="button">next</div>
...
<div id="next1" class="button">next</div>
Может кому-то пригодится