No description, website, or topics provided.
JavaScript
Switch branches/tags
Nothing to show
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Failed to load latest commit information.
README.md
watermark.css
watermark.js
watermark.min.js

README.md

Prototype.Watermark

Mirrored from http://www.blipuscek.com/?p=27 (no longer working)

Watermark is a PrototypeJS based class that emulates the HTML5 placeholder attribute for Internet Explorer.

It uses and overlying div to present the placeholder text instead of changing the textual content of an input box. Since any changes of text can cause some problems when posting a form I found this to be an ideal solution. The component works in all browsers that PrototypeJS supports.

A relative and absolute div is wrapped around a text input or area to make sure that watermark is positioned right above it. Styles from the underlying input box are copied into the watermark div element. We can also apply watermark to every element that has a class named "watermark"

Usage

Include the watermark.js after prototype.js and link or import the CSS file.

<script src="prototype.js" type="text/javascript"></script>
<script src="watermark.js" type="text/javascript"></script>
<link rel="stylesheet" type="text/css" href="watermark.css" />
<!--   OR    -->
<style type="text/css">
@import url('watermark.css');
</style>

Example

By default any <input /> or <textarea /> tags with the watermark class will get the watermark attached to them. Update the title tag to change the text of the watermark.

<input type="text" class="watermark" title="My default data" />

Real running example is here http://jsfiddle.net/jwestbrook/QJWdK/