Quickly improved paginator (for Backbone PageableCollection). The active page stays the one in the middle of the pages list. The relevant part is the "makeHandles" method

paginator.js

/*jslint indent: 2*/
/*global define*/
'use strict';
define([
  'backbone',
  'underscore',
  'backgrid-paginator'
], function(Backbone, _){
  var ISIE = $('html').hasClass('lt-ie9');

  var Paginator = Backgrid.Extension.Paginator.extend({
    windowSize: 9,

    render: function() {
      var pager = this;
      if (ISIE) {
        // There's a display bug in IE8 for the arrows,
        // pager.fastForwardHandleLabels = {
        //   first: '<',
        //   prev: '<<',
        //   next: '>',
        //   last: '>>'
        // };

        // and additionally there's a bug when clicking on the arrows (in IE8 again)
        // that's why we hide them completely
        pager.fastForwardHandleLabels = {
          first: null,
          prev: null,
          next: null,
          last: null
        };
      }

      var selector = 'a[href^="#"]';
      var hash = location.hash;
      hash = hash.slice(0, 1) === '#' ? hash.slice(1, hash.length) : hash;

      Backgrid.Extension.Paginator.prototype.render.apply(this, arguments);
      pager
        .$(selector)
        .attr('href', '#'+ hash)
      ;
      return pager;
    },

    /**
       Internal method to create a list of page handle objects for the template
       to render them.

       @return {Array.<Object>} an array of page handle objects hashes
     */
    makeHandles: function () {

      var handles = [];
      var collection = this.collection;
      var state = collection.state;

      // convert all indices to 0-based here
      var firstPage = state.firstPage;
      var lastPage = +state.lastPage;
      lastPage = Math.max(0, firstPage ? lastPage - 1 : lastPage);
      var currentPage = Math.max(state.currentPage, state.firstPage);
      currentPage = firstPage ? currentPage - 1 : currentPage;

      var halfWindow = Math.floor(this.windowSize / 2);

      var windowStart = Math.floor(currentPage / this.windowSize) * this.windowSize;
      if (currentPage > halfWindow) {
        windowStart = windowStart + ((currentPage - windowStart) - halfWindow);
      }
      var windowEnd = Math.min(lastPage + 1, windowStart + this.windowSize);
      if ((windowEnd - windowStart) < windowStart) {
        windowStart = windowEnd - this.windowSize;
      }

      if (collection.mode !== 'infinite') {
        for (var i = windowStart; i < windowEnd; i++) {
          handles.push({
            label: i + 1,
            title: 'No. ' + (i + 1),
            className: currentPage === i ? 'active' : undefined
          });
        }
      }

      var ffLabels = this.fastForwardHandleLabels;
      if (ffLabels) {

        if (ffLabels.prev) {
          handles.unshift({
            label: ffLabels.prev,
            className: collection.hasPrevious() ? void 0 : 'disabled'
          });
        }

        if (ffLabels.first) {
          handles.unshift({
            label: ffLabels.first,
            className: collection.hasPrevious() ? void 0 : 'disabled'
          });
        }

        if (ffLabels.next) {
          handles.push({
            label: ffLabels.next,
            className: collection.hasNext() ? void 0 : 'disabled'
          });
        }

        if (ffLabels.last) {
          handles.push({
            label: ffLabels.last,
            className: collection.hasNext() ? void 0 : 'disabled'
          });
        }
      }

      return handles;
    }
  });
  return Paginator;
});