baseheight
v1.3.0
Published
Equal heights for set of responsive columns
Downloads
8
Maintainers
Readme
jQuery BaseHeight Plugin
Equal heights for set of responsive columns.
Description
BaseHeight is just another simple jQuery plugin that equalizes responsive heights of given elements. It works perfectly with multiple sets on a single page and it's also a great module to control due to it's methods.
Demo
baseheight.mev.bg
Getting Started
You can download the plugin as an archive.
Or you can grab it by using npm:
npm install baseheight
Or you can grab it by using Bower:
bower install baseheight
Installation
Include the script after the jQuery library (unless you package scripts otherwise):
<script src="/path/to/baseheight.min.js"></script>
Usage
Initialization
There are two ways of initializing BaseHeight.
I. jQuery function
The first way is as follows:
$.baseheight(); // returns the target
This is the most basic initialization. It's a good way to use only if it's for a single set of elements on a page. By calling it so, the plugin will look for anything with "baseheight" class. If no such elements, nothing will happen.
Of course, you can also provide specific targets with a custom selector by doing so:
$.baseheight({
target: $('selector')
});
II. Method function
The second way is as a method function. So, we can also use the plugin this way:
$('selector').baseheight(); // returns the target
Options
target
Defines a custom target selector.
The target property is only available when initialize BaseHeight as a jQuery function like the example below.
$.baseheight({
target: $('selector')
});
Default value: $('.baseheight')
Methods
baseheightOff()
Removes the alignment and turns the equalizer off.
var columns = $('selector').baseheight();
columns.baseheightOff();
baseheightOn()
Aligns the targets and turns the equalizer on.
var columns = $('selector').baseheight();
columns.baseheightOn();
destroy()
Removes the alignment and deletes all BaseHeight methods from the target.
var columns = $('selector').baseheight();
columns.destroy();
Browsers compatibility
- Apple Safari
- Google Chrome
- Microsoft Internet Explorer 9+
- Mozilla Firefox
- Opera
Dependencies
License
Copyright © 2017 Martin Metodiev. Licensed under the MIT license. See here for more details.