jquery - jQuery分页下一个和上一个

Question

我想实现一个典型的分页行为，所以当我单击下一个时，会向左和向右滚动。

目前有效，但不会移动到下一个数字。

希望下面的PNG更有意义

我的演示很清楚，但我不能做更多的事情。

http://jsfiddle.net/B5zCu/99/

我的jQuery

$('ol > li').each(function() {
    $(this).prepend("<a>" + ($(this).index() +1) +  "</a>");

    $('ol > li').eq(0).addClass('first-page');
    $('ol > li').last().addClass('last-page');
    $('ol > li').eq(-2).addClass('space').children('a').text('...');
    $('ol > li').eq(1).css('margin-left', '40px');
    $('ol > li').eq(6).addClass('seven').css('margin-right', '100px');  

});

$('.pagination li').on('click', function(event) {
  event.preventDefault();
  var $this = $(this),
      $pagination = $this.parent(),
      $pages = $pagination.children(),
      $active = $pagination.find('.active');

  if($this.hasClass('a.prev')) {
    if ($pages.index($active) > 0) {
      $active.removeClass('active').prev().addClass('active');
    }
  } else if($this.hasClass('a.next')) {
    if ($pages.index($active) < $pages.length - 1) {
      $active.removeClass('active').next().addClass('active');
    }
  } else {
    $this.addClass('active').siblings().removeClass('active');
  }

  $active = $pagination.find('.active');

  $('a.prev')[$pages.index($active) == 0 ? 'addClass' : 'removeClass']('disabled');
  $('a.next')[$pages.index($active) == $pages.length - 1 ? 'addClass' : 'removeClass']('disabled');

});


$('.pagination li:eq(0)').trigger('click');