Skip to content

HTTPS clone URL

Subversion checkout URL

You can clone with HTTPS or Subversion.

Download ZIP
tree: b1e654dedc
Fetching contributors…

Cannot retrieve contributors at this time

77 lines (71 sloc) 3.592 kb
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>Ekwal - jQuery/Zepto and Vanilla plugin to equalize all the things</title>
<meta name="description" content="
Ekwal is a jQuery/Zepto plugin or a Vanilla JS (IE9+) plugin which helps you to equalize elements according to
their height or width
">
<link rel="stylesheet" href="styles/bootstrap.css">
<link rel="stylesheet" href="styles/main.css">
<script src="scripts/vendor/modernizr.min.js"></script>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="//platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
</head>
<body>
<div class="container" style="margin-top:50px">
<div class="hero-unit row">
<h1>Ekwal <small>equalize all the things</small></h1>
<p>
A <a href="http://jquery.com">jQuery</a>/<a href="http://zeptojs.com">Zepto</a> or
a <a href="http://vanilla-js.com/">Vanilla JS</a>/<a href="http://vaporjs.com/">Vapor.js</a> (IE9+)
plugin to equalize elements.<br>
<a href="https://twitter.com/share" class="twitter-share-button" data-via="calvein" data-size="large" data-dnt="true">Tweet</a>
<iframe src="http://ghbtns.com/github-btn.html?user=Calvein&repo=ekwal&type=watch&size=large&count=true"
allowtransparency="true" frameborder="0" scrolling="0" width="165px" height="30px"></iframe>
</p>
</div>
<div class="row">
<h2>jQuery/Zepto Version</h2>
<p>
To use it, just call the <code>jQuery#ekwal()</code> method on the elements you want to equalize.<br>
It accept any of the <a href="http://api.jquery.com/category/dimensions/">jQuery dimension methods</a> names
as a parameter, and is, by default, <code>height</code>.<br>
e.g : <code>$('el').ekwal([dimension])</code>
</p>
<form class="form-inline" data-type="jquery">
<!-- Who's gonna test that with IE7 ? -->
<input type="text" placeholder="'height' is the default value">
<button class="btn btn-primary" type="submit">Test it</button>
<ul class="placeholder">
<li><li><li><li><li><li>
<li><li><li><li><li><li>
<li><li><li><li><li><li>
</ul>
</form>
<hr>
<h2>Vanilla Version</h2>
<p>
To use it, just call the <code>ekwal()</code> function with the elements you want to equalize.<br>
As of the jQuery version, it accept a parameter which can be <code>height</code> (by default) or <code>width</code><br>
e.g : <code>ekwal('el'[, 'width'])</code>
</p>
<form class="form-inline">
<!-- Who's gonna test that with IE7 ? -->
<input type="text" placeholder="'height' is the default value">
<button class="btn btn-primary" type="submit">Test it</button>
<ul class="placeholder">
<li><li><li><li><li><li>
<li><li><li><li><li><li>
<li><li><li><li><li><li>
</ul>
</form>
</div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script src="scripts/jquery.ekwal.js"></script>
<script src="scripts/ekwal.js"></script>
<script src="scripts/main.js"></script>
</body>
</html>
Jump to Line
Something went wrong with that request. Please try again.