Skip to content
Permalink
Browse files

Accordion: New approach to synchronizing animations. Fixes #4178 - Ac…

…cordion animation a bit jumpy in some browsers.
  • Loading branch information...
scottgonzalez committed Oct 1, 2012
1 parent 4ab4684 commit d20f05ea37f17ec7799fb4d989c2ecba8689b096
Showing with 23 additions and 17 deletions.
  1. +23 −17 ui/jquery.ui.accordion.js
@@ -16,20 +16,12 @@

var uid = 0,
hideProps = {},
showProps = {},
showPropsAdjust = {};
showProps = {};

hideProps.height = hideProps.paddingTop = hideProps.paddingBottom =
hideProps.borderTopWidth = hideProps.borderBottomWidth = "hide";
showProps.height = showProps.paddingTop = showProps.paddingBottom =
showProps.borderTopWidth = showProps.borderBottomWidth = "show";
$.extend( showPropsAdjust, showProps, { accordionHeight: "show" } );

$.fx.step.accordionHeight = function( fx ) {
var elem = $( fx.elem ),
data = elem.data( "ui-accordion-height" );
elem.height( data.total - elem.outerHeight() - data.toHide.outerHeight() + elem.height() );
};

$.widget( "ui.accordion", {
version: "@VERSION",
@@ -485,12 +477,12 @@ $.widget( "ui.accordion", {
_animate: function( toShow, toHide, data ) {
var total, easing, duration,
that = this,
adjust = 0,
down = toShow.length &&
( !toHide.length || ( toShow.index() < toHide.index() ) ),
animate = this.options.animate || {},
options = down && animate.down || animate,
complete = function() {
toShow.removeData( "ui-accordion-height" );
that._toggleComplete( data );
};

@@ -512,15 +504,29 @@ $.widget( "ui.accordion", {
}

total = toShow.show().outerHeight();
toHide.animate( hideProps, duration, easing );
toHide.animate( hideProps, {
duration: duration,
easing: easing,
step: function( now, fx ) {
fx.now = Math.round( now );
}
});
toShow
.hide()
.data( "ui-accordion-height", {
total: total,
toHide: toHide
})
.animate( this.options.heightStyle === "content" ? showProps : showPropsAdjust,
duration, easing, complete );
.animate( showProps, {
duration: duration,
easing: easing,
complete: complete,
step: function( now, fx ) {
if ( fx.prop !== "height" ) {
fx.now = Math.round( now );
adjust += fx.now;
} else {
fx.now = Math.round( total - toHide.outerHeight() - adjust );
adjust = 0;
}
}
});
},

_toggleComplete: function( data ) {

0 comments on commit d20f05e

Please sign in to comment.
You can’t perform that action at this time.