Javascript：淡入淡出答案

【问题标题】：Javascript: Fade in and outJavascript：淡入淡出
【发布时间】：2009-10-19 11:44:23
【问题描述】：

我有这个基于 PHP 的文档（聊天框），您可以在其中输入消息并发送。

现在，我有这个淡入淡出的动画，当消息发送时消息进来。看起来像这样：

Javascript：

function stateChanged1() 
{ 
if (xmlHttp1.readyState==4)
{ 
document.getElementById("sent").innerHTML="Sent!";
document.writeform.message.value="";
chat();
}
}

在体内：

<span id="sent"></span>

问题是它并没有淡出。我必须在代码中添加什么以及在哪里添加？

【问题讨论】：

您的“淡出”代码在哪里？贴出来的sn-p跟褪色没有关系。

标签： javascript function animation fade

【解决方案1】：

对于像淡出这样的效果，请使用 JQuery、Prototype 或 MooTools 等框架。他们将为您提供如何将效果应用于元素的大量示例。

【讨论】：

+1 提及可用于解决此问题的各种框架

【解决方案2】：

添加

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>

到您的 HTML 并添加此 JavaScript 代码：

$("#sent").fadeOut("slow");

在这一行之后：

document.getElementById("sent").innerHTML="Sent!";

【讨论】：

有效。但对于慢速它进行得相当快。我的代码的奇怪之处在于，如果我再次发送消息，它不会显示“已发送！”再次发短信。你需要一些额外的脚本吗？
显示“发送！”消息再次使用 $("#sent").fadeIn("fast");
可能在 document.getElementById("sent").innerHTML="Sent!"; ?
超级旧，但对于那些发现这一点的人，您可以设置毫秒以及参数之一。 api.jquery.com/fadeOut

【解决方案3】：

试试 jquery，你可以轻松地淡入和淡出一个元素 e.i:

$("#sent").fadeIn("slow");
$("#sent").fadeOut("slow");

【讨论】：

【解决方案4】：

我还建议你应该使用 jquery 的淡入淡出功能。如需更深入的解释和代码示例，请转到：http://docs.jquery.com/Effects/fadeOut

【讨论】：