Take the 2-minute tour ×

I am currently using a background image on my inputs to show a default value. When the input field is focused, the background disappears. However, Firefox auto-completes my fields with data if the user has chosen to save it and the default background image is still visible. How can I hide the background image when the field has been autocompleted by a browser?

share|improve this question
Maybe some javascript could do the trick. Are you using jQuery? –  v42 Sep 14 '11 at 0:29

2 Answers 2

up vote 2 down vote accepted

There might be some crazy CSS selector that would allow you to do this, but you could use JavaScript to get rid of the background if there's text in the input:

// on page load
if (yourInput.value) {
    yourInput.style.backgroundImage = '';

...Or whatever. Something similar.

share|improve this answer

You can turn autocomplete off either on the whole form or on a specific input:

<form autocomplete="off"></form>

If you want to add a listener to this event, Firefox 4+ will fire an "oninput" event when autocompleted.

share|improve this answer

Your Answer


