jquery shapeshift

[CesarIrnan]

Me voy auto contestando.

He cambiado el código y lo he dejado así:

Código:

// Generated by CoffeeScript 1.4.0
(function() {

  $(function() {
    var $containers, child_count, filter_options, getRandomColor, renderChildren, renderPlaceholders;
    $containers = $(".ss-container");		
    child_count = 5;
	contador = 0;
    (renderChildren = function() {
      var weighted_colspans;
      weighted_colspans = [1];
      return $containers.each(function(container_i) {
        var colspan, elements, height, i, _i;
        elements = [];
        for (i = _i = 0; 0 <= child_count ? _i < child_count : _i > child_count; i = 0 <= child_count ? ++_i : --_i) {	        
          elements.push("<img src='template/images/obj_" + contador + ".png'><div class='position'><div></div></div></li>"); 
		  contador++;       
        }
        return $(this).append(elements.join(""));
      });
    })();
	
    $containers.shapeshift(filter_options);
    $(".options ul.animation li").on("click", function() {
      switch ($(this).data("option")) {
        case "enable":
          filter_options.animated = true;
          break;
        default:
          filter_options.animated = false;
      }
      return $containers.shapeshift(filter_options);
    });
    $(".options ul.dragndrop li").on("click", function() {
      switch ($(this).data("option")) {
        case "enable":
          filter_options.enableDrag = true;
          filter_options.enableDrop = true;
          break;
        default:
          filter_options.enableDrag = false;
          filter_options.enableDrop = false;
      }
      $containers.trigger('ss-destroy');
      return $containers.shapeshift(filter_options);
    });
    $(".options ul.placeholders li").on("click", function() {
      renderPlaceholders($(this).data("option"));
      return $containers.shapeshift(filter_options);
    });
    $containers.on("ss-arranged", function(e, selected) {
      var modifier;
      modifier = $(this).find(".ss-dragging")[0] ? 1 : 0;
      return $(this).children().each(function() {
        return $(this).find(".position").text($(this).index() - modifier);
      });
    });
	
    $containers.on("ss-rearranged", function(e, selected) {
      console.log("----------------------------------------");
      console.log("This container:");
      console.log($(this));
      console.log("Has rearranged this item:");
      console.log($(selected));
      return console.log("Into this position:", $(selected).index());
    });
    $containers.on("ss-removed", function(e, selected) {
      console.log("----------------------------------------");
      console.log("This item:");
      console.log($(selected));
      console.log("Has been removed from this container:");
      return console.log($(this));
    });
    $containers.on("ss-added", function(e, selected) {
      console.log("----------------------------------------");
      console.log("This item:");
      console.log($(selected));
      console.log("Has been added to this container:");
      return console.log($(this));
    });
    $containers.on("ss-trashed", function(e, selected) {
      console.log("----------------------------------------");
      console.log("This item:");
      console.log($(selected));
      return console.log("Has been removed from the DOM");
    });
    return $containers.on("ss-drop-complete", function(e) {
      console.log("----------------------------------------");
      console.log("This container:");
      console.log($(this));
      return console.log("Has finished rearrangement after a drop.");
    });
  });

}).call(this);

El problema es este:



Hay un abismo entre cada elemento, y no se dónde buscar para reducirlo