0

1) I would change the input placeholder color in some condition using javascript (not CSS if it will change the placeholder color forever) 2) And I want that the placeholder change to another placeholder onmouseover the input box. I got this function:

if(email.value==''){
email.style.borderColor = "#FF0000";
email.setAttribute('placeholder',"Plea… fill this required field");
//code for changing the placeholder color
//code for changing the placeholder onmouseover
}

1) The placeholder color for me usually is "#C9C9C9" I want to change it to another color by this code. 2) I want the placeholder text to change to any other text onmouseover. I will be thankful for the one who will give me the code.

Thanks

Abdallah Barghouti
  • 85
  • 1
  • 2
  • 12

1 Answers1

4

Look with this post's answer to do it in CSS : Change an HTML5 input's placeholder color with CSS

Then, you can include the CSS rule with javascript.

And you just have to use pseudo-class :hover for the mouseover.

Just like that :

CSS

input.formInvalid::-webkit-input-placeholder {
   color: red;
}

Javascript

document.getElementById("yourElementId").className += " formInvalid"; //add the class .formInvalid to your element
Community
  • 1
  • 1
Emilie
  • 668
  • 1
  • 9
  • 21