I have this succes message that the visitor sees after submitting the contact form via ajax using jquery:
My question is:
How can I first fadeIn the image, and then "500 later" fadeIn the rest of the text that is appended after the image?
-Now it fades in all at the same time.
This is the code:
var dataString = 'navn='+ navn + '&email=' + email + '&besked=' + besked + '&virksomhed=' + virksomhed + '&hjemmeside=' + hjemmeside + '&om=' + om;
//alert (dataString);return false;
$.ajax({
type: "POST",
url: "includes/mail_process.php",
data: dataString,
success: function() {
$('#kontakt_form').html("<div id='mail_succes'></div>");
$('#mail_succes').html("<h2 class=\"catch_font26\" style=\"background-color:#849fa5; padding:1px; color:#FFF;\">Tak for din besked!</h2>")
.append("<br /><div style=\"float:left;\"><img id='checkmark' src='styles/frontend_img/email_ok.jpg' width=\"30\" height=\"30\"/></div>")
.append("<div style=\"float:left; margin-left:20px;\"><p style=\"font-size:20px;\">Vi vil vende tilbage på din henvendelse hurtigst muligt.</p><br /><p style=\"font-size:16px;\">Hvis I har yderligere spørgsmål kan vi også kontaktes pr. telefon:</p><br /><table><tr><td><p style=\"font-size:14px;\"><b>Telefon nr. </b></p></td><td style=\"padding-left:15px;\"><p>+0045 00 00 00 00</p></td></tr><tr><td><p style=\"font-size:14px;\"><b>Tidsrum: </b></p></td><td style=\"padding-left:15px;\"><p style=\"font-size:14px;\">Alle hverdage fra kl. 9-17.</p></td></tr></table><br /><p style=\"font-size:14px;\">Med Venlig Hilsen</p><p style=\"font-size:14px;\"><b>enkelt-webdesign</b></p>")
.hide()
.fadeIn(1700);
}
});
return false;
});
});
Sorry if it looks a little messy.. :-)
Klemme