Question: I have a registration form, and i want to use a password field. The problem is, i want it to have a placeholder saying "Password" at the begining so i'm using a text field instead. I need to turn the characters into asterisks or black circles like a password field when the user starts typing.  

I've tried changing the "type" attribute to "password" through javascript, so i'm stuck.  

Is there a simple way to resolve this with css? or does anyone know of a good javascript(preferably jquery) to hack this?  

Thanks

Answer: 
1. Use a regular password field
2. Don't abuse the `value` as a placeholder — it becomes invisible to, among others, screen reader users.
3. Put the label in a `<label>`
4. Position the label behind the input
5. Restyle the input with JS to change the background

Demo at <http://dorward.me.uk/tmp/label-work/example.html>
Hover a `div` or a `span` tag over your text (password) field, then hide it when the password field takes focus or the div/span is clicked.