动画占位符文字?

时间:2014-03-04 10:39:59

标签: jquery html forms animation placeholder

有人可以帮助我将文字动画添加到我创建的表单中吗?

当你刷新页面时,文本当前是动画的,虽然我需要它像表单中的占位符一样工作,但它工作正常。

一旦用户点击表单,文本就会消失,使用户能够正常搜索。

请参阅我的Fiddle

如果有人可以协助请更新小提琴,非常感谢您的帮助!

var txt = $('.writer').text();
var timeOut;
var txtLen = txt.length;
var char = 0;
$('.writer').text('|');
(function typeIt() {   
    var humanize = Math.round(Math.random() * (200 - 30)) + 30;
    timeOut = setTimeout(function() {
        char++;
        var type = txt.substring(0, char);
        $('.writer').text(type + '|');
        typeIt();

        if (char == txtLen) {
            $('.writer').text($('.writer').text().slice(0, -1)); // remove the '|'
            clearTimeout(timeOut);
        }

    }, humanize);
}());

2 个答案:

答案 0 :(得分:4)

你去吧

Fiddle Demo

基本上,在'var txt'中包含自定义文本,而不是查找DOM来获取文本。

答案 1 :(得分:2)

我认为您正在寻找attr('占位符')?

$('.main-search').attr('placeholder');

请参阅我的更新:http://jsfiddle.net/tdpK5/1/