Recently, I’ve been using Jquery framework to do all my Javascript chores. Needless to say, I love it. Documentation rocks, easy to implement and lovely syntax. The reason I write this post is not to praise Jquery but to see whether anyone experience some kind of weirdness in their effect functions.
So weirdness came, when I fetch my information using AJAX and construct the information in HTML. Subsequently, I insert the HTML using append() and after that I slideDown() it. It works perfectly fine - no lagged.
However, when I shift the slideDown() outside of the AJAX, $.getJSON(), it gives some sort of lagged. Weird huh?
Snippet of the code below…
Lagged Version
$.getJSON("ajax/get_contact_person.php", { id : person_id }, function(json){
html += // All the HTML codes;
// Insert the retrieved information
$(”div#contact_” + person_id).append(html);
});
// Slide out the information
$(”div#contact_” + person_id).slideDown(”medium”);
Smooth Version
$.getJSON("ajax/get_contact_person.php", { id : person_id }, function(json){
html += // All the HTML codes;
// Insert the retrieved information
$(”div#contact_” + person_id).append(html);
// Slide out the information
$(”div#contact_” + person_id).slideDown(”medium”);
});
Any explanation will be grateful. ![]()










August 19th, 2007 at 12:04 am
[…] Link to Article ajax Weird Jquery slideUp() and slideDown() Effects » This excerpt is from an […]
August 19th, 2007 at 1:44 am
That’s because, in the first one, you’re starting the animation before the Ajax request has finished - and before the new content has been loaded into the div. By waiting until the div actually has some contents in it, the slideDown will perform smoothly.
August 19th, 2007 at 1:48 am
John Resig: Thanks for the reply. Now I get it.
November 12th, 2007 at 5:13 pm
[…] Link to Article ajax Weird Jquery slideUp() and slideDown() Effects » This excerpt is from an […]