by Matt Coughlin

Simple Form Styling with Default Text:

Goal:

Example:

Implementation notes:

HTML:

<input type="text" class="simple-form" id="user-name" name="user-name" />

<div class="default-password-text simple-form">
    <label for="password" id="passwordDefault">Enter password</label>
    <input type="password" id="password" name="password" value="" />
</div>

<textarea class="simple-form resize" name="comments" id="comments" cols="30" rows="4"></textarea>
        

CSS:

simple-style.css

default-password-text.css

JavaScript:

simpleForm.style();

setDefaultInputText('#user-name', 'Enter user name');
setDefaultPasswordText('#password', '#passwordDefault');

setDefaultInputText('#comments', 'Enter your comments');
        

simple-style.js

setDefaultInputText.js

default-password-text.js