This plugin comes from the “should I just use a table?” department of design technicalities that we still have to deal with in 2012: equalize.js (GitHub: tsvensen / equalize.js, License: MIT/GPL). Created by Tim Svensen, this plugin resizes elements to match their height or any other dimension supported by jQuery Dimensions.
It works by calling a single method on the parent selector:
// Height is the default $('#height-example').equalize(); $('.parent').equalize('outerHeight'); $('.parent').equalize('innerHeight'); $('.parent').equalize('width'); $('.parent').equalize('outerWidth'); $('.parent').equalize('innerWidth');
The documentation has full examples.
jQuery Builder (GitHub: jgallen23 / jquery-builder, License: MIT, npm: jquery-builder) by Greg Allen is a web-based tool for building a custom version of jQuery 1.8.1. As jQuery has evolved it’s got a lot easier to include only the components necessary for a given project. This particular solution has been made using Node, and is installable with npm.
Gridster.js (GitHub: ducksboard / gridster.js, License: MIT) from Ducksboard is a grid plugin that allows layouts to be designed by drag and drop. Elements can span multiple columns, and by dynamically added and removed. Any element can be used because Gridster is based around data attributes.
Gridster is distributed with suitable CSS, and supports IE 9+, Firefox, Chrome, Safari, and Opera.