【问题标题】:Animating Placeholder Text?动画占位符文本?
【发布时间】:2014-04-05 20:22:17
【问题描述】:

谁能帮我将我的文本动画添加到我创建的表单中?

当您刷新页面时,文本当前会显示动画,虽然我需要它像表单中的占位符一样工作,但效果很好。

一旦用户点击表单,文本需要消失,以便用户能够正常搜索。

请看我的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);
}());

【问题讨论】:

  • 你的意思是占位符文本应该是动画的?并在用户点击后删除?
  • 是的,这正是我的意思?

标签: jquery html forms animation placeholder


【解决方案1】:

我认为您正在寻找 attr('placeholder') ?

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

查看我的更新:http://jsfiddle.net/tdpK5/1/

【讨论】:

  • 谢谢。如何删除不在占位符中的其他文本。我把它取下来了,它坏了。
【解决方案2】:

给你

Fiddle Demo

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

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2018-03-21
    • 2018-07-26
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-11-28
    • 2014-09-15
    • 1970-01-01
    相关资源
    最近更新 更多