2

有没有办法淡入和淡出输入的占位符文本?

我试过了:

$('.userBox::-webkit-input-placeholder').animate({color: '#888888'}, 500);

但这只是崩溃...

4

3 回答 3

7

如果您想在焦点上淡出,并在模糊时淡入(当输入框为空时),以下应该在 webkit 中工作:

HTML:

<input id="user_email" name="user[email]" placeholder="user@example.org" type="email" />

CSS:

input[type="email"]::-webkit-input-placeholder  {
  -webkit-transition: opacity 0.3s linear; 
  color: gray;
}

input[type="email"]:focus::-webkit-input-placeholder  {
  opacity: 0;
}

jsfiddle:http: //jsfiddle.net/a9UA3/

于 2013-08-04T22:20:22.330 回答
3

如果您指的是浏览器实现提供的占位符文本,我不这么认为。如果您想使用focus, blur&key*事件实现自定义占位符,那么可以。

于 2013-07-13T00:15:37.823 回答
-2

尝试使用

$('.userBox::-webkit-input-placeholder').fadeOut(500);

或者,您也可以使用插件。

于 2013-07-13T00:15:36.803 回答