search

caridy / yui3-gallery

YUI3 Gallery Modules
http://yuilibrary.com/gallery
17 stars 3 forks source link

Node Accordion animation isn't smooth #10

Open neilerdwien opened 13 years ago

neilerdwien commented 13 years ago

Starting with:

http://caridy.github.com/examples/gallery-node-accordion/horizontal.html

I added animation (see https://github.com/caridy/yui3-gallery/issues/9).

I also made the regions larger so the effect is more visible. The result is at:

http://www.k-state.edu/dev/neil/node-accordion-horizontal-example-big.html

The problem is that the animation makes the right-hand edge jiggle. I think what is going on is that the panel that is opening is being animated independently of the panel that is closing. Small timing errors are causing the total width of the panel to vary. The result is visible even without the panels bigger.

I presume there could be one animation with the tween event to calculate the other length.

caridy commented 13 years ago

Hey,

the main issue is the minWidth. you have two options:

a) I added a "minWidth" attribute in the latest revision, so, you can set it to 1, which means that it will never be animated down to 0, since some browsers will fail to do so for block or inline elements.

b) use the "active" class as a selector to hide the content of the item when collapsed (position: absolute), and hide to the left when the active class is not set.

best regards, caridy