Javascript: Fade in and out

Question

Hello,

i have this PHP based doc (chatbox) where you can type your message and send it.

Now, i have this fade animation where a message comes in when a message is send. Looks like this:

Javascript:

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

in the body:

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

The problem is then it isnt fading out. What do i have to add to the code and where?

Answer 1

For Effects like fading out use a framework like JQuery, Prototype or MooTools. They will provide you with ample examples how to apply effects to elements.

Answer 2

try jquery you can fadein and fade out an element easly e.i:

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

Answer 3

Add

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

to your HTML and add this JavaScript Code:

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

after this line:

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

Answer 4

i also recommend that you should use jquery's fade in and fade out function. for a deeper explanation and code samples please goto: http://docs.jquery.com/Effects/fadeOut