This is caused by margin or padding on the element being animated.

Try this experiment: Make sure you have the Web Developer Toolbar extension
installed in Firefox. Load the tutorial page and test the slide in/slide out
to confirm that it jerks at the end of the animation.

Now select CSS / Edit CSS on the Web Developer Toolbar. Select the Embedded
Styles tab in the Edit CSS sidebar and scroll to the end. Add this rule at
the end:

body * { margin:0 !important; padding:0 !important; }

Repeat the test and you'll find that it no longer jerks.

If you're really curious, try zeroing either the margin or the padding but
not both. What I notice is that margin causes a jerk on a slideUp ("Slide
Out" on the test page), and padding causes a jerk on the slideDown ("Slide
In"). So you need to zero them both.

If you can zero the margin and padding on the animated element in your page,
it should fix it.

-Mike

> From: JohnieKarr
> 
> Does anyone have any ideas on this?
> 
> I have gone to jquery.com and looked at different tutorials 
> as well as different plug-in example sites, and it is obvious 
> the difference between IE and Firefox.
> 
> This link for example:
> http://docs.jquery.com/Tutorials:Live_Examples_of_jQuery
> 
> Try the second example.  You have to look carefully, but 
> there is a jerk at the end of the slide in.
> 
> You have to look close, but you will see it, especially if 
> you do a side by side comparison with ff.
> 
> One thing I have noticed is that the longer the webpage stays 
> open, and the more times the script runs, the smoother it gets.
> 
> Any ideas or discussion on this is greatly appreciated.
> 
> Thanks!

Reply via email to