QuickValidate 1.2
by elclanrs
HTML
<p><strong>» Download: </strong><a target="_blank" href="https://github.com/elclanrs/jq-quickvalidate/tree/testing">https://github.com/elclanrs/jq-quickvalidate/tree/testing</a></p>
<br/>
<form id="my-form">
<p><label>Username:</label><input name="username" type="text"/></p>
<p><label>Password:</label><input name="pass" type="password"/></p>
<p><label>E-Mail:</label><input name="email" type="text"/></p>
<p><label>Date:</label><input name="date" type="text" placeholder="mm/dd/yy"/></p>
<p><label> </label><button type="submit">Submit</button></p>
<div style="clear: both;"></div>
</form>
CSS
.qval-field-width{width:407px;}
*{-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;}
.qval-form{font-size:15px;}.qval-form p{float:left;clear:both;position:relative;margin:.5em 0;}
.qval-form label,.qval-form input,.qval-form .field{float:left;position:relative;}
.qval-form label{padding-right:1.7em;text-align:left;}
.qval-form input[type="text"],.qval-form input[type="password"],.qval-form textarea{padding:.3em;width:225px;border:1px solid #ccc;outline:0;}
.qval-form .valid-icon,.qval-form .invalid-icon{position:absolute;top:50%;margin-top:-8px;right:-24px;height:16px;width:16px;}
.qval-form textarea~.valid-icon,.qval-form textarea~.invalid-icon{top:7.5px;margin-top:0;}
.qval-form .valid-icon{background:url("http://i46.tinypic.com/28cmt7b.png") no-repeat;}
.qval-form .invalid-icon{background:url("http://i49.tinypic.com/15pswee.png") no-repeat;cursor:pointer;}
.qval-form input.invalid{background:#fffbd4;color:#3b3600;border:1px solid #d4c000;}
.qval-form input.valid{background:#edfcd9;color:#223904;border:1px solid #78c610;}
.qval-form .error{position:absolute;width:150px;right:-182px;margin-right:-10px;top:15px;z-index:999;padding:.8em 1.2em;font-size:80%;text-shadow:1px 1px 0 rgba(0, 0, 0, 0.5);background:#183e59;background:-webkit-gradient(linear, left top, left bottom, from(#183e59), to(#235a81));background:-moz-linear-gradient(center top, #183e59 0%, #235a81 100%);background:-moz-gradient(center top, #183e59 0%, #235a81 100%);color:white;border-bottom:1px solid #183e59;-webkit-box-shadow:0px 1px 1px rgba(0, 0, 0, 0.3);-moz-box-shadow:0px 1px 1px rgba(0, 0, 0, 0.3);box-shadow:0px 1px 1px rgba(0, 0, 0, 0.3);}
.qval-form .error:after{content:"";position:absolute;top:0;left:-19.42857142857143px;border-style:solid;border-width:0 10.714285714285715px 10.714285714285715px 10.714285714285715px;border-color:transparent #183e59 transparent transparent;}
.qval-form.stack .field,.qval-form.stack...
JavaScript
/* --------------------------------------------------------
jq-quickvalidate 1.2
* Author: Cedric Ruiz
* License: GPLv2
* Website: https://github.com/elclanrs/jq-quickvalidate
-------------------------------------------------------- */(function(a){"use strict";var b={getKeys:function(a){var b=[],c="";for(c in a)a.hasOwnProperty(c)&&b.push(c);return b},getMaxWidth:function(b){var c=0;return b.each(function(){a(this).outerWidth()>c&&(c=a(this).outerWidth())}),c},getLessVar:function(b,c){var d=a('<p class="'+b+'"></p>').hide().appendTo("body").css(c);return a("."+b).remove(),/\d+/.test(d)?parseInt(d,10):d}},c={number:{regex:/\d+/,error:"Must be a number."},digits:{regex:/^\d+$/,error:"Must be only digits."},name:{regex:/^[A-Za-z]{3,}$/,error:"Must be at least 3 characters long, and must only contain letters."},username:{regex:/^[a-z](?=[\w.]{3,31}$)\w*\.?\w*$/i,error:"Must be at between 4 and 32 characters long and start with a letter. You may use letters, numbers, underscores, and one dot (.)"},pass:{regex:/(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{6,}/,error:"Must be at least 6 characters long, and contain at least one number, one uppercase and one lowercase letter."},strongpass:{regex:/(?=^.{8,}$)((?=.*\d)|(?=.*\W+))(?![.\n])(?=.*[A-Z])(?=.*[a-z]).*$/,error:"Must be at least 8 characters long and contain at least one uppercase and one lowercase letter and one number or special character."},email:{regex:/^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/,error:"Must be a valid e-mail address. <em>(e.g. [email protected])</em>"},phone:{regex:/^[2-9]\d{2}-\d{3}-\d{4}$/,error:"Must be a valid US phone number. <em>(e.g. 555-123-4567)</em>"},zip:{regex:/^\d{5}$|^\d{5}-\d{4}$/,error:"Must be a valid US zip code. <em>(e.g. 33245 or 33245-0003)</em>"},url:{regex:/^(?:(ftp|http|https):\/\/)?(?:[\w\-]+\.)+[a-z]{3,6}$/i,error:"Must be a valid URL. <em>(e.g. www.google.com)</em>"},min:{regex:function(a,b){return this.error="Must be at least "+a.data.min+" characters...