我多次调用$("input").attr("placeholder,"Another String")
函数。
我希望这些字符串能够平滑地过渡(类似于fadeIn/Out
的效果)。我该怎么做?我不介意使用哪种工具来完成这个任务(CSS、纯JS或JQuery),只要能完成就行。
我多次调用$("input").attr("placeholder,"Another String")
函数。
我希望这些字符串能够平滑地过渡(类似于fadeIn/Out
的效果)。我该怎么做?我不介意使用哪种工具来完成这个任务(CSS、纯JS或JQuery),只要能完成就行。
::-webkit-input-placeholder { transition : opacity 0.5s; }
::-moz-placeholder { transition : opacity 0.5s; }
:-ms-input-placeholder { transition : opacity 0.5s; }
.fade::-webkit-input-placeholder { opacity : 0; }
.fade::-moz-placeholder { opacity : 0; }
.fade:-ms-input-placeholder { opacity : 0; }
JS:
$("input").addClass("fade");
setTimeout(function() {
$("input").attr("placeholder", "New text here")
.removeClass("fade");
}, 500);
以上内容在Chrome中似乎完美地运作。在IE中,它有点工作:它将占位文本淡入淡出,但也淡化了输入边框 - 奇怪。在FF中没有发生淡入淡出效果 - 不确定为什么。
尽管它只部分工作,但我发布了它,因为至少它给了您一个起点。