有没有办法用 jQuery 为 textarea 的不透明度设置动画？

Question

我需要为 textarea 中文本的不透明度设置动画，使其逐渐消失。当有人按下 Enter 键时会发生这种情况。 我已经设置了回车键的代码，但无法让代码动画工作。 这是我的代码：

$(document).keydown(function(e){
if(e.which === 13){
// here I would like to animate the text
   };
});

Answer 1

仅对于文本，我认为您需要 jQueryUI，并执行以下操作：

$("#textarea").keydown(function(e){
    if(e.which === 13){
        $(this).animate({color: 'transparent'},1000);
   }
});

这是一个小提琴： http : //jsfiddle.net/adeneo/7pkNK/

请注意，光标也会消失，据我所知，唯一的解决方法是使用动画 gif 或其他一些自定义代码创建一个光标。

Answer 2

    $(document).keydown(function(e){
     if(e.which === 13){
      $(formelement).animate({ color: "#FFFFFF" }, 600);

   };
});

Answer 3

这个来自 JQuery API 的例子有帮助吗？

<div id="clickme">
   Click here
</div>
<img id="book" src="book.png" alt="" width="100" height="123" />

$('#clickme').click(function() {
  $('#book').fadeOut('slow', function() {
    // Animation complete.
  });
});

查看 .fadeIn() 和 .fadeTo() 的 API。

在你的情况下，你可以只使用 $('#text' ).fadeOut();

Answer 4

尝试使用jQuery 的fadeOut 方法来实现。

$(document).keydown(function(e) {
    var code = (e.keyCode ? e.keyCode : e.which);
    if (code === 13) {
        //here i would like to animate the text
        $('#idofobject').fadeOut(optionalduration, optionalcallback);
    }
});

根据这个 SO answer ，我将使用我的代码的第二行检索被按下的键。

---

阅读您对@dremme 的评论后，我不相信有一种方法可以淡化简单的文本。 您必须在包含文本的文本区域上方放置一个 div，删除当前在文本区域中的文本，然后淡出覆盖的 div。