Question

我想淡化字符串中的字符，以便Whatever变成Wha ever。

$('p[2]').animate({ opacity: 0 });

Fiddle

如果可能的话，我想在没有将每个字母包装在HTML标签中的情况下这样做。

Answer 1

您需要包装想要遮罩的角色，以对此元素应用效果。

尝试：

var hideLetter = function(element, position) {
    var str = $(element).text(),
        nstr = str.substr(0, position) + '<span>'  + str.substring(position, position + 1) + '</span>' + str.substring(position + 1);

    $(element).html(nstr);

    $(element).find('span').animate({
        opacity: 0
    });
};

hideLetter('p', 2);

<强> Fiddle

Answer 2

看看这有助于http://jsfiddle.net/EP3nR/5/

// Wrap each letter in a span tag
$('p').html(function(){
  return this.textContent.replace(/./g,'<span>$&</span>');
});

// Get 3rd char and hide it
var char = $('p').find('span').eq(2).animate({opacity:0}).text();

// The char that was hidden
$('h1').text(char);

您还可以使用回调添加后隐藏的角色：

$('p').find('span').eq(2).animate({opacity: 0}, function () {
  $('h1').text(this.textContent);
});

有没有简单的方法来为字符串中的特定字符设置动画？

2 个答案: