Perfectsize NPM

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!

@infinitebrahmanuniverse/nolb-perf @everything-registry/sub-chunk-2426

1.0.0

9 years ago