4

As said here : Change an HTML5 input's placeholder color with CSS, Chrome doesn't support the CSS property color for input placeholders.

But there is a property named -webkit-input-placeholder. If I put on my CSS :

#MyInput::-webkit-input-placeholder {
    color: blue;
}

It works. But how can I do this with Javascript (or jQuery) ?

Community
  • 1
  • 1
Arnaud
  • 4,884
  • 17
  • 54
  • 85
  • 1
    Define it in the CSS as you have it, but make it `#MyInput.blue-placeholder::-webkit-input-placeholder` and add/remove the "blue-placeholder" class with jQuery. – Ian May 08 '13 at 17:44
  • Yes, it's a solution that I had not thought, thank you. I'm still looking for direct solutions. Meanwhile, I take this one ! – Arnaud May 08 '13 at 17:47

1 Answers1

3

Define it in the CSS as you have it, but make it #MyInput.blue-placeholder::-webkit-input-placeholder and add/remove the "blue-placeholder" class with jQuery.

#MyInput.blue-placeholder::-webkit-input-placeholder {
    color: #0000ff;
}

DEMO: http://jsfiddle.net/AY3j6/

Ian
  • 50,146
  • 13
  • 101
  • 111
  • 1
    Thank you for the demo, I didn't know toggleClass. I can accept your answer in 5 minutes. ;) – Arnaud May 08 '13 at 17:50
  • @Arnaud No problem. The `toggleClass` was just for an example. You can use `addClass` and `removeClass` as well – Ian May 08 '13 at 17:51
  • @Arnaud Sounds good :) Glad you learned about it and can use it. If it helps, even though it's pretty straightforward, here's the docs for it: http://api.jquery.com/toggleClass/ – Ian May 08 '13 at 17:53
  • @Dex Hmm I just tested on Safari 6.2 and it works fine. You understand you have to click the button, right? If you have a question about setting the placeholder color, you might want to search or ask a new question. This question was specifically about toggling the color with JavaScript/jQuery - my solution was to just target and toggle a class, which should work in any browser (especially with jQuery). Your version of Safari may not support the `::-webkit-input-placeholder`, which this question isn't about. I wish I knew more about Safari or could help – Ian Dec 06 '14 at 07:07