我试图自定义该 jquery 脚本，但我不能。
我唯一想做的就是把盒子换成照片，就像小猫一样，但没有选择，但我做不到
http://mcpants.github.com/jquery.shapeshift/
这就是存储库
(function() {
$(function() {
var $containers, child_count, filter_options, getRandomColor, renderChildren, renderPlaceholders;
$containers = $(".ss-container");
child_count = 5;
(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) {
colspan = 209;
height = 280;
elements.push("<li data-ss-colspan=" + colspan + " style='height: " + height + "px'><div class='position'><div>" + i + "</div></div></li>");
}
return $(this).append(elements.join(""));
});
})();
getRandomColor = function() {
var color, i, letters, _i, _ref;
letters = 'ABCDEF'.split('');
color = '';
for (i = _i = 0, _ref = letters.length; 0 <= _ref ? _i < _ref : _i > _ref; i = 0 <= _ref ? ++_i : --_i) {
color += letters[Math.round(Math.random() * 5)];
}
return color;
};
(renderPlaceholders = function(type) {
return $containers.each(function() {
var $child, $children, background, height, i, width, _i, _results;
$children = $(this).children().not(".credits");
child_count = $children.length;
if (type === "index") {
return $(this).find(".position").show();
} else {
$(this).find(".position").hide();
_results = [];
for (i = _i = 0; 0 <= child_count ? _i < child_count : _i > child_count; i = 0 <= child_count ? ++_i : --_i) {
$child = $($children[i]);
height = $child.height();
width = $child.width();
switch (type) {
case "fpoimg":
background = 'url("http://fpoimg.com/' + width + 'x' + height + '?bg_color=' + getRandomColor() + '&text_color=444444")';
break;
case "placekittens":
background = 'url("http://www.placekitten.com/' + width + '/' + height + '")';
}
_results.push($child.css({
backgroundImage: background,
height: height
}));
}
return _results;
}
});
})("fpoimg");
filter_options = {
minColumns: 3
};
$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.filtering li").on("click", function() {
switch ($(this).data("option")) {
case "hide":
$containers.children(":visible").sort(function() {
return Math.round(Math.random()) - 0.5;
}).first().hide();
break;
default:
$containers.children(":hidden").sort(function() {
return Math.round(Math.random()) - 0.5;
}).first().show();
}
return $containers.trigger("ss-rearrange");
});
$(".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);