Skip to content

Instantly share code, notes, and snippets.

@rfessler
Created October 24, 2012 15:51
Show Gist options
  • Save rfessler/3946887 to your computer and use it in GitHub Desktop.
Save rfessler/3946887 to your computer and use it in GitHub Desktop.
javascript: jquery error plugin
<!DOCTYPE HTML>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<title>
</title>
</head>
<body>
<span id="title">
field-validation-error classes
</span>
<br>
<input id="errorinput1" class="field-validation-error-border" type="text"
value="-border" />
<br>
<input id="errorinput2" class="field-validation-error-highlight" type="text"
value="-highlight" />
<br>
<input id="errorinput3" class="field-validation-error " type="text" value="-error"
/>
<br>
<br>
<div id="errordiv">
<span>
Exchange
</span>
is a required field. please enter an exchange.
</div>
</body>
</html>
/*
error- border: #f00
error- background-color: #fee
*/
html {font-size:12px;}
input {width:300px; font-weight:bold; font-size: 1.5em;margin-top:10px;}
.field-validation-error-border {border: 1px solid #f00; }
.field-validation-error-highlight { background-color: #fee; }
.field-validation-error { color: #f00; padding: 0; }
#errordiv {
background-color: #fee;
border: 1px solid #f00;
font-size: 1em;
overflow: visible;
padding: 3px;
position: absolute;
text-align: center;
width: 100px;
}
#title {font-size:2em; font-weight:bold;}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment