Search jQuery

jQuery Forum

Using jQuery

adentone

why does my page jump and can I prevent it?

in Using jQuery • 4 years ago

I have been working on a horizontal accordion effect for my client's new home page.

It works fine except that the whole page seems to jump when you click the buttons to make it scroll...

http://www.eaglevideo.net/hdemo.htm

using: jQuery 1.4 & jQuery Easing 1.3

Note: only tested in Safari & Firefox on Mac so far - but the problem is present in both.

Does anyone have any suggestions that will help me keep the page from reacting this way?

Replies(5)

amohler

Re: why does my page jump and can I prevent it?

4 years ago

Give your .accordion class a set height of 380 - 400px or so, and an overflow: hidden; it's jumping out of the layout when the slides change for some reason.

adentone

Re: Re: why does my page jump and can I prevent it?

4 years ago

sweet - that worked quite well

superfici..

Re: why does my page jump and can I prevent it?

4 years ago

Hi Adentone,

It looks like the combined width of your li's are wider than its container on the moment of the beginning of the animation,

This forces the right floated element to the bottom and this triggers the vertical scrollbar in many cases becasue the page is extended by the height of the li.

The scrollbar is the "jump" you see because this makes all your content shift 10 pixels to the left becasue of the vertical scrollbar taking up about 20px (depending on OS and settings).

adentone

Re: Re: why does my page jump and can I prevent it?

4 years ago

that was a very informative "why" answer. thank you.

adentone

Re: why does my page jump and can I prevent it?

4 years ago

So, I added to the accordion class height: 400px; overflow: hidden; and that seemed to stop almost all of the "jump".

Now, do you have any further suggestions on how to make the animation more smooth? Specifically, the right edge of the accordion seems to "vibrate" during the animation... any ideas to keep that more steady?

Topic Type :

No of days :

Top Reply

Response title

Attachments

jQuery Forum

why does my page jump and can I prevent it?

Replies(5)

Re: why does my page jump and can I prevent it?

Re: Re: why does my page jump and can I prevent it?

Re: why does my page jump and can I prevent it?

Re: Re: why does my page jump and can I prevent it?

Re: why does my page jump and can I prevent it?

Statistics

Tags

Actions

Related Posts