PrimeFaces – Watermark on text input

In PrimeFaces, your can use <p:watermark> to display watermark effect on input field. This watermark component is using HTML5 placeholder attribute in supported browsers like Safari, Chrome and Firefox, and fall back to JavaScript solution for non-support browser like IE. Display watermark text in input field <p:inputText id="username" required="true" label="username" size="40" value="#{userBean.username}" /> <p:watermark for="username" …

Read more

jQuery – watermark effect on text input

A simple jQuery example to show you how to implement a watermark text effect on an input field. 1. Code Snippets An email input field and css watermark class. <style type="text/css"> input.watermark { color: #999; } //light silver color </style> <label>Email : </lable> <input id="email" type="text" /> jQuery to apply the watermark effect on email …

Read more