слайдер срабатывает один раз

[serrrgggeee]

Здравствуйте есть такой слайдер http://hostserg.irk0.ru/ сейчас работает только кнопка "forward", я уже над ним долго мучаюсь почти доделал но срабатывает он только один раз не могу разобраться в чем дело вот весь его код

(function($) {
$.fn.scrollbox = function(config) {
  //default config
  defConfig = {
    linear: false,          // Scroll method
    step: 50,                // Distance of each single step (in pixels)
    speed: 32,              // Delay after each single step (in milliseconds)
    switchItems: 1,         // Items to switch after each scroll event
    direction: 'vertical',
    distance: 'auto',			
  };
  config = $.extend(defConfig, config);
  config.scrollOffset = config.direction === 'vertical' ? 'scrollTop' : 'scrollLeft';
  return this.each(function() {
    var container = $(this),
        containerUL,
        nextScrollId = null,
        forward,
        scrollForward,
    containerUL = container.children('ul:first-child');
    scrollForward = function() {
      var curLi,
          i,
          newScrollOffset,
          scrollDistance,
          theStep;
				containerUL.children('li:nth-child(1)').removeClass('leftSide');
		curLi = containerUL.children('li:nth-child(1)').addClass('rightSide ');
				containerUL.children('li:nth-child(2)').removeClass('scale90 leftSide');
				containerUL.children('li:nth-child(2)').addClass('scale80 leftSide');
				containerUL.children('li:nth-child(3)').removeClass('scale100');
				containerUL.children('li:nth-child(3)').addClass('scale90 leftSide');
				containerUL.children('li:nth-child(4)').removeClass('scale90 rightSide');
				containerUL.children('li:nth-child(4)').addClass('scale100');
				containerUL.children('li:nth-child(5)').removeClass('scale80 rightSide');
				containerUL.children('li:nth-child(5)').addClass('scale90 rightSide');
      scrollDistance = config.distance !== 'auto' ? config.distance :
        config.direction === 'vertical' ? curLi.height() : curLi.width();
      // offset
      if (!config.linear) {
        theStep = Math.max(3, parseInt((scrollDistance - container[0][config.scrollOffset]) * 0.3, 10));
        newScrollOffset = Math.min(container[0][config.scrollOffset] + theStep, scrollDistance);
      } else {
        newScrollOffset = Math.min(container[0][config.scrollOffset] + config.step, scrollDistance);
      }
      container[0][config.scrollOffset] = newScrollOffset;
      if (newScrollOffset >= scrollDistance) {
        for (i = 0; i < config.switchItems; i++) {
            containerUL.append(containerUL.children('li:first-child'));
        }
        container[0][config.scrollOffset] = 0;
        clearInterval(scrollingId);
      }
    };
    forward = function() {
      scrollingId = setInterval(scrollForward, config.speed);
    };
    // bind events for container
    container.bind('forward', function() { clearTimeout(nextScrollId); forward(); });
  });
};
}(jQuery));

[Царь Леонид]

Я увидел функцию forward и обработчик, который ее вызывает, а вот ф-цию backward не увидел, или у меня проблемы с глазами или это и есть причина почему работает только кнопка вперед, чтобы слайдер работал много раз нужно сделать рекурсию

[serrrgggeee]

все нормально вы правельно не увидили, просто я упростил код что бы было легче настраивать, а проблема в том что, срабатывает слайдер только раз, и все а потом что то не пойму почему не работает.

[Царь Леонид]

Я с мобильного сижу, поэтому html посмотреть не могу, так что просто объясню. Слайдер - это список <li>, соответственно нужно написать ф-цию - проверку, если это последний элемент, то слайдер начинает цикл со своего нулевого элемента, тоже самое надо сделать, если значение ушло в минус, ставить это в обработчики и в саму ф-цию слайдера, как-то так

[serrrgggeee]

мне тяжело так воспринимать))

[рони]

serrrgggeee,

(function($) {
$.fn.scrollbox = function(config) {
  //default config
  defConfig = {
    step: 50,                // Distance of each single step (in pixels)
    speed: 32,              // Delay after each single step (in milliseconds)
    switchItems: 1,         // Items to switch after each scroll event
    direction: 'vertical',
    distance: 'auto',
  };
  config = $.extend(defConfig, config);
  config.scrollOffset = config.direction === 'vertical' ? 'scrollTop' : 'scrollLeft';
  return this.each(function() {
    var container = $(this),
        containerUL,
        nextScrollId = null,
        forward,
        scrollForward,
    containerUL = container.children('ul:first-child');
    scrollForward = function() {

                containerUL.children('li').removeClass('scale80 scale90 scale100 leftSide rightSide');
				containerUL.children('li:nth-child(1)').addClass('scale80 leftSide');
				containerUL.children('li:nth-child(2)').addClass('scale90 leftSide');
				containerUL.children('li:nth-child(3)').addClass('scale100');
				containerUL.children('li:nth-child(4)').addClass('scale90 rightSide');
				containerUL.children('li:nth-child(5)').addClass('scale80 rightSide');

    };
    forward = function() {
      scrollingId = setInterval(scrollForward, config.speed);
    };
    // bind events for container
    container.bind('forward', function() { clearTimeout(nextScrollId);containerUL.append(containerUL.children('li:nth-child(1)')) ; forward();});
    container.bind('backward', function() { clearTimeout(nextScrollId);containerUL.prepend(containerUL.children('li:nth-child(5)')) ; forward();});
  });
};
}(jQuery));

[serrrgggeee]

спасибо большое, только мне не понятно две последние строчки

container.bind('forward', function() { clearTimeout(nextScrollId);containerUL.append(containerUL.children('li:nth-child(1)')) ; forward();});

мы вставляем первый или последний эллемент, а остальные получается автоматом вставляются? хотя это уже не суть есть работчий пример уже легче учить и понимать)))

[рони]

остальные получается автоматом вставляются

остальные автоматом сдвигаются влево или в право

[рони]

serrrgggeee,
на всякий случай функция scrollForward в этом случае лишняя -- достаточно перенести тело функции в ксс, добавив containerUL какой-нибудь класс