perfectsize
v1.0.0
Published
Lightweight HTML Equalizer
Downloads
1
Readme
perfectsize.js - Lightweight & Simple HTML Equalizer
As said, it's a simple way to resize your HTML elements regarding the biggest one by block or by line !
Version
1.0.0
Tech
It's written in a pure and simple JS algorithm, no jQuery, no Angular, no Require, no bullshit...
Installation
With npm
Sources are then in the node_modules folders.
$ cd YOURFOLDER
$ npm install perfectsize
Or directly via git
$ git clone https://github.com/alxpereira/perfectsize.git
Use it !
perfectsize.js is easy to use
Call it in your head or wherever your want :
<!DOCTYPE html>
<html>
<head>
<title>My superb app</title>
<script src="../min/perfectsize.min.js"></script>
Init the plugin in your code :
<script>
perfectsize.init();
</script>
</body>
The containers can be called by default perfectgroup
<body>
<div id="container" class="perfectgroup">
<div class="box size25"></div>
<div class="box size50"></div>
<div class="box size25"></div>
<div class="box size25"></div>
Or you can select an identifier to target them
// with a class
perfectsize.init({ selector : '.mycontainer' });
// with an id
perfectsize.init({ selector : '#mycontainer' });
// with an tagname
perfectsize.init({ selector : 'atagname' });
Grouping
By default perfectsize is doing an equalizer on the all group taking the highest children height to apply it on all the children.
// nothing to do :)
But you can also tell him to do an equalizer by line ! (yeah)
// with a class
perfectsize.init({ byline : true });
DOM ready
You can also force the plugin to waiting the document ready event to launch the equalizer :
// with a class
perfectsize.init({ domready : true });
License
WTFPL (Do What the Fuck You Want to Public License) 2004
(Copyleft) 2015 - Alexandre Pereira
Free Software, Hell Yeah!