php回显到html与jquery淡入淡出效果

Question

I am trying to echo php to html, everything works fine but the echo stays on the page until refresh it goes away. anyway I can use jquery to fade in, out it?

part of the php coding:

$q1=mysql_query("SELECT `DEALS` FROM `show` LIMIT 1");
$d1=mysql_fetch_array($q1);
$n2=$d1['DEALS'];
if($n2!=0){

foreach($addresses as $to) { 
mail($to, $subject, $message, $headers);
}
echo'<center><span class="text-wrapper-2 text-wrapper-green">Email Sent!
</span></center>';
}
else{

echo'<center><span class="text-wrapper-2 text-wrapper-red">Email Failed</span></center>';    
}

so the code above echo correctly to html but I would like to add some jquery face effects to it. Any suggestions would be great.

Thanks to all in advance.

Answer 1

The JavaScript interaction happens entirely client-side, after the PHP is done. So essentially you'd echo the output and then do the client-side effects. So let's say you echo something like this:

<span class="text-wrapper-2 text-wrapper-green" id="emailMessage" style="display:none;">Email Sent!</span>

Note that I added an id to the element to make it easy to identify. I also gave it an in-line style to not display, since you want it to fade-in first. Feel free to move that styling into CSS as appropriate.

Then in your client-side code you might have something like this:

$('#emailMessage').fadeIn(400, function () {
    setTimeout(function () {
        $('#emailMessage').fadeOut();
    }, 5000);
});

This will fade the element in and then set a timer to fade it back out 5 seconds later.