Unsmooth slideDown/slideUp transitions

Example: http://andrewliesenfeld.com/pxbpanel/account-overview/change-password/
Hit submit on the form and you’ll see a container slide down. Click the arrows within the container to slide up. Rinse and repeat to see the less-than-fluid animation. The choppy-ness starts at the beginning of slideDown and at the end of slideUp.

The JQuery is:

$(document).ready(function() { $("#changepw .submit").click(function(event) { $.post( "<?php echo URLADDR ?>functions/changepw-form.func.php", $("#changepw form").serialize(), function(data) {

$('#response').html(data); $('#response .error').slideDown(2000, 'easeInOutExpo'); $('#response .error').css("display", "inline-block"); $("#response #hide").click(function(event) { $('#response .error').slideUp(2000, 'easeInOutExpo'); });

} ); }); });

The middle part of the code is where the animation is.

Have you played with other time values to see if the choppiness is the same?

Yah, I’ve used different combinations of time increments and easings and nothing has fixed it so far.

The reason for the choppiness is there is still an error, you have to reset it somehow. I would check out unbind and bind, that might solve your problem??? However, I not sure - I’m going to play around with code in JSFiddle, I’ll get back with you.

Also I would change this from:
[php]$("#changepw .submit").click(function(event) {[/php]

to this:
[php]$("#changepw .submit").on('click, function(event) {[/php]

That might help a little?

Sponsor our Newsletter | Privacy Policy | Terms of Service