Hey Rick, I noticed the jump in IE 6. I assume that is the browser that you are viewing the bug in. At first, I thought you were referring to the slight jitter that occurs while both animations are occurring, which is addressed by John's fix.
The bug is actually an IE css bug related to the default browser margins on the ul tags. Rather than using a bottom margin to space the ul's, you should use bottom padding instead. I have posted an example that doesn't jitter in IE 6 with the appropriate css to cancel out the browser defaults. I am not seeing any issues in IE 7 with either padding or margins and this code. http://salingermultimedia.com/jQuery/accordian/IEsucks.html I hope this helps. -Marshall -----Original Message----- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of Rick Faircloth Sent: Saturday, March 03, 2007 1:14 PM To: 'jQuery Discussion.' Subject: Re: [jQuery] FW: Why are my graphics "jumping"? Hi, John...and thanks for the reply. It happens whenever a graphic starts the slide upwards. It jumps from its starting position to about where the bottom link is, then the slide smooths out. I noticed you're example doesn't do it. Although in IE 7 when the page is first loaded or refreshed and a graphic is clicked... most visible when the first or second graphic is clicked... the slide takes place, but the graphic doesn't move until the slide is finished. After the first click, the graphics slide normally. I copied your markup to a page and tried it and I get the same results. So your markup solves one problem, but creates another, at least in IE 7. But I just can't figure out why Carlos' menu works so well at http://www.generalmedicine.com/index2.htm and mine doesn't. I think I've got all the pertinent files and markup necessary. ??? Rick -----Original Message----- From: [EMAIL PROTECTED] [mailto:[EMAIL PROTECTED] On Behalf Of John Resig Sent: Saturday, March 03, 2007 2:07 PM To: jQuery Discussion. Subject: Re: [jQuery] FW: Why are my graphics "jumping"? Are you talking about when you click "For Physicians" then click "Facilities" - and the "For Hospitals" image jumps a little bit? If so, that's currently an issue with how jQuery does animation - they are not synchronized in nature. For example. the one div is sliding up and the other is sliding down, it's not guaranteed that when one is at 90px tall, the other will be exactly at 10px (if the combined height was 100px). Unfortunately, it requires significant overhead (in jQuery) to do something that complex. If you absolutely must not have the final image move, the alternative is to position everything absolutely, then simply adjust the top of the sections that you need to move (in addition to doing a slideup/slidedown on the links). I took the time to build a demo for you, since it is rather non-trivial: http://john.jquery.com/ticket/stable-slide/ I restructured the markup to be ul/li elements (works better in this case) and gave all child uls a set height (this is required if you want the image positions to remain stable). In the case of this demo, I set the height to 75 pixels - but you can adjust that. --John _______________________________________________ jQuery mailing list [email protected] http://jquery.com/discuss/ _______________________________________________ jQuery mailing list [email protected] http://jquery.com/discuss/
