jQuery Plugin For Equalizing The Height of Your Elements - Equal Height Columns
| File Size: | 4.17KB |
|---|---|
| Views Total: | 1762 |
| Last Update: | |
| Publish Date: | |
| Official Website: | Go to website |
| License: | MIT |
Equal Height Columns is an useful jQuery plugin that equalize the height of elements to make them have the same height. Ideal for creating a clean and neat layout for your website.
See also:
Basic Usage:
1. Create a collection of html elements that have different height.
<div id="example"> <div class="left"> ... </div> <div class="center"> ... </div> <div class="right"> ... </div> </div>
2. Load the jQuery javascript library and jQuery Equal Height Columns at the bottom of your page.
<script src="http://code.jquery.com/jquery-latest.min.js"></script> <script src="jquery.equal-height-columns.js"></script>
3. Set all the DIVs have the same height. The height is the highest of the passed elements.
<script> $(#example).equalHeightColumns(); </script>
4. Options.
<script>
$(#example).equalHeightColumns({
speed : 0,
// Speed of the element's height change animation.
height : 0,
// Set the height that all of passed elements should be.
minHeight : 0,
// Set the minimum height all of the elements should be.
maxHeight : 0,
//Set the maximum height all of the elements should be.
resize : function()
// Resize columns.
});
</script>
This awesome jQuery plugin is developed by dogzworld. For more Advanced Usages, please check the demo page or visit the official website.











