Skip to content

J
jquery
Commit d1a4077f authored by Stefan Petre's avatar Stefan Petre
Browse files
Options

Added transition effect

parent 2daf4929
Hide whitespace changes
Inline Side-by-side
Showing with 600 additions and 499 deletions
src/fx/fx.js
View file @ d1a4077f
jQuery.fn.extend({ jQuery.fn.extend({
// overwrite the old show method // overwrite the old show method
_show: jQuery.fn.show, _show: jQuery.fn.show,
/** /**
* Show all matched elements using a graceful animation and firing an * Show all matched elements using a graceful animation and firing an
* optional callback after completion. * optional callback after completion.
* *
* The height, width, and opacity of each of the matched elements * The height, width, and opacity of each of the matched elements
* are changed dynamically according to the specified speed. * are changed dynamically according to the specified speed.
* *
* @example $("p").show("slow"); * @example $("p").show("slow");
* *
* @example $("p").show("slow",function(){ * @example $("p").show("slow",function(){
* alert("Animation Done."); * alert("Animation Done.");
* }); * });
* *
* @name show * @name show
* @type jQuery * @type jQuery
* @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000). * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).
* @param Function callback (optional) A function to be executed whenever the animation completes. * @param Function callback (optional) A function to be executed whenever the animation completes.
* @cat Effects/Animations * @param String transition (optional) Transition effect
* @see hide(String|Number,Function) * @cat Effects/Animations
*/ * @see hide(String|Number,Function)
show: function(speed,callback){ */
return speed ? this.animate({ show: function(speed,callback, transition){
height: "show", width: "show", opacity: "show" return speed ? this.animate({
}, speed, callback) : this._show(); height: "show", width: "show", opacity: "show"
}, }, speed, callback, transition) : this._show();
},
// Overwrite the old hide method
_hide: jQuery.fn.hide, // Overwrite the old hide method
_hide: jQuery.fn.hide,
/**
* Hide all matched elements using a graceful animation and firing an /**
* optional callback after completion. * Hide all matched elements using a graceful animation and firing an
* * optional callback after completion.
* The height, width, and opacity of each of the matched elements *
* are changed dynamically according to the specified speed. * The height, width, and opacity of each of the matched elements
* * are changed dynamically according to the specified speed.
* @example $("p").hide("slow"); *
* * @example $("p").hide("slow");
* @example $("p").hide("slow",function(){ *
* alert("Animation Done."); * @example $("p").hide("slow",function(){
* }); * alert("Animation Done.");
* * });
* @name hide *
* @type jQuery * @name hide
* @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000). * @type jQuery
* @param Function callback (optional) A function to be executed whenever the animation completes. * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).
* @cat Effects/Animations * @param Function callback (optional) A function to be executed whenever the animation completes.
* @see show(String|Number,Function) * @param String transition (optional) Transition effect
*/ * @cat Effects/Animations
hide: function(speed,callback){ * @see show(String|Number,Function)
return speed ? this.animate({ */
height: "hide", width: "hide", opacity: "hide" hide: function(speed,callback, transition){
}, speed, callback) : this._hide(); return speed ? this.animate({
}, height: "hide", width: "hide", opacity: "hide"
}, speed, callback, transition) : this._hide();
/** },
* Reveal all matched elements by adjusting their height and firing an
* optional callback after completion. /**
* * Reveal all matched elements by adjusting their height and firing an
* Only the height is adjusted for this animation, causing all matched * optional callback after completion.
* elements to be revealed in a "sliding" manner. *
* * Only the height is adjusted for this animation, causing all matched
* @example $("p").slideDown("slow"); * elements to be revealed in a "sliding" manner.
* *
* @example $("p").slideDown("slow",function(){ * @example $("p").slideDown("slow");
* alert("Animation Done."); *
* }); * @example $("p").slideDown("slow",function(){
* * alert("Animation Done.");
* @name slideDown * });
* @type jQuery *
* @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000). * @name slideDown
* @param Function callback (optional) A function to be executed whenever the animation completes. * @type jQuery
* @cat Effects/Animations * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).
* @see slideUp(String|Number,Function) * @param Function callback (optional) A function to be executed whenever the animation completes.
* @see slideToggle(String|Number,Function) * @param String transition (optional) Transition effect
*/ * @cat Effects/Animations
slideDown: function(speed,callback){ * @see slideUp(String|Number,Function)
return this.animate({height: "show"}, speed, callback); * @see slideToggle(String|Number,Function)
}, */
slideDown: function(speed,callback, transition){
/** return this.animate({height: "show"}, speed, callback, transition);
* Hide all matched elements by adjusting their height and firing an },
* optional callback after completion.
* /**
* Only the height is adjusted for this animation, causing all matched * Hide all matched elements by adjusting their height and firing an
* elements to be hidden in a "sliding" manner. * optional callback after completion.
* *
* @example $("p").slideUp("slow"); * Only the height is adjusted for this animation, causing all matched
* * elements to be hidden in a "sliding" manner.
* @example $("p").slideUp("slow",function(){ *
* alert("Animation Done."); * @example $("p").slideUp("slow");
* }); *
* * @example $("p").slideUp("slow",function(){
* @name slideUp * alert("Animation Done.");
* @type jQuery * });
* @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000). *
* @param Function callback (optional) A function to be executed whenever the animation completes. * @name slideUp
* @cat Effects/Animations * @type jQuery
* @see slideDown(String|Number,Function) * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).
* @see slideToggle(String|Number,Function) * @param Function callback (optional) A function to be executed whenever the animation completes.
*/ * @param String transition (optional) Transition effect
slideUp: function(speed,callback){ * @cat Effects/Animations
return this.animate({height: "hide"}, speed, callback); * @see slideDown(String|Number,Function)
}, * @see slideToggle(String|Number,Function)
*/
/** slideUp: function(speed,callback, transition){
* Toggle the visibility of all matched elements by adjusting their height and firing an return this.animate({height: "hide"}, speed, callback, transition);
* optional callback after completion. },
*
* Only the height is adjusted for this animation, causing all matched /**
* elements to be hidden in a "sliding" manner. * Toggle the visibility of all matched elements by adjusting their height and firing an
* * optional callback after completion.
* @example $("p").slideToggle("slow"); *
* * Only the height is adjusted for this animation, causing all matched
* @example $("p").slideToggle("slow",function(){ * elements to be hidden in a "sliding" manner.
* alert("Animation Done."); *
* }); * @example $("p").slideToggle("slow");
* *
* @name slideToggle * @example $("p").slideToggle("slow",function(){
* @type jQuery * alert("Animation Done.");
* @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000). * });
* @param Function callback (optional) A function to be executed whenever the animation completes. *
* @cat Effects/Animations * @name slideToggle
* @see slideDown(String|Number,Function) * @type jQuery
* @see slideUp(String|Number,Function) * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).
*/ * @param Function callback (optional) A function to be executed whenever the animation completes.
slideToggle: function(speed, callback){ * @param String transition (optional) Transition effect
return this.each(function(){ * @cat Effects/Animations
var state = jQuery(this).is(":hidden") ? "show" : "hide"; * @see slideDown(String|Number,Function)
jQuery(this).animate({height: state}, speed, callback); * @see slideUp(String|Number,Function)
}); */
}, slideToggle: function(speed, callback, transition){
return this.each(function(){
/** var state = jQuery(this).is(":hidden") ? "show" : "hide";
* Fade in all matched elements by adjusting their opacity and firing an jQuery(this).animate({height: state}, speed, callback, transition);
* optional callback after completion. });
* },
* Only the opacity is adjusted for this animation, meaning that
* all of the matched elements should already have some form of height /**
* and width associated with them. * Fade in all matched elements by adjusting their opacity and firing an
* * optional callback after completion.
* @example $("p").fadeIn("slow"); *
* * Only the opacity is adjusted for this animation, meaning that
* @example $("p").fadeIn("slow",function(){ * all of the matched elements should already have some form of height
* alert("Animation Done."); * and width associated with them.
* }); *
* * @example $("p").fadeIn("slow");
* @name fadeIn *
* @type jQuery * @example $("p").fadeIn("slow",function(){
* @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000). * alert("Animation Done.");
* @param Function callback (optional) A function to be executed whenever the animation completes. * });
* @cat Effects/Animations *
* @see fadeOut(String|Number,Function) * @name fadeIn
* @see fadeTo(String|Number,Number,Function) * @type jQuery
*/ * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).
fadeIn: function(speed, callback){ * @param Function callback (optional) A function to be executed whenever the animation completes.
return this.animate({opacity: "show"}, speed, callback); * @param String transition (optional) Transition effect
}, * @cat Effects/Animations
* @see fadeOut(String|Number,Function)
/** * @see fadeTo(String|Number,Number,Function)
* Fade out all matched elements by adjusting their opacity and firing an */
* optional callback after completion. fadeIn: function(speed, callback, transition){
* return this.animate({opacity: "show"}, speed, callback, transition);
* Only the opacity is adjusted for this animation, meaning that },
* all of the matched elements should already have some form of height
* and width associated with them. /**
* * Fade out all matched elements by adjusting their opacity and firing an
* @example $("p").fadeOut("slow"); * optional callback after completion.
* *
* @example $("p").fadeOut("slow",function(){ * Only the opacity is adjusted for this animation, meaning that
* alert("Animation Done."); * all of the matched elements should already have some form of height
* }); * and width associated with them.
* *
* @name fadeOut * @example $("p").fadeOut("slow");
* @type jQuery *
* @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000). * @example $("p").fadeOut("slow",function(){
* @param Function callback (optional) A function to be executed whenever the animation completes. * alert("Animation Done.");
* @cat Effects/Animations * });
* @see fadeIn(String|Number,Function) *
* @see fadeTo(String|Number,Number,Function) * @name fadeOut
*/ * @type jQuery
fadeOut: function(speed, callback){ * @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).
return this.animate({opacity: "hide"}, speed, callback); * @param Function callback (optional) A function to be executed whenever the animation completes.
}, * @param String transition (optional) Transition effect
* @cat Effects/Animations
/** * @see fadeIn(String|Number,Function)
* Fade the opacity of all matched elements to a specified opacity and firing an * @see fadeTo(String|Number,Number,Function)
* optional callback after completion. */
* fadeOut: function(speed, callback, transition){
* Only the opacity is adjusted for this animation, meaning that return this.animate({opacity: "hide"}, speed, callback, transition);
* all of the matched elements should already have some form of height },
* and width associated with them.
* /**
* @example $("p").fadeTo("slow", 0.5); * Fade the opacity of all matched elements to a specified opacity and firing an
* * optional callback after completion.
* @example $("p").fadeTo("slow", 0.5, function(){ *
* alert("Animation Done."); * Only the opacity is adjusted for this animation, meaning that
* }); * all of the matched elements should already have some form of height
* * and width associated with them.
* @name fadeTo *
* @type jQuery * @example $("p").fadeTo("slow", 0.5);
* @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000). *
* @param Number opacity The opacity to fade to (a number from 0 to 1). * @example $("p").fadeTo("slow", 0.5, function(){
* @param Function callback (optional) A function to be executed whenever the animation completes. * alert("Animation Done.");
* @cat Effects/Animations * });
* @see fadeIn(String|Number,Function) *
* @see fadeOut(String|Number,Function) * @name fadeTo
*/ * @type jQuery
fadeTo: function(speed,to,callback){ * @param String|Number speed A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).
return this.animate({opacity: to}, speed, callback); * @param Number opacity The opacity to fade to (a number from 0 to 1).
}, * @param Function callback (optional) A function to be executed whenever the animation completes.
* @param String transition (optional) Transition effect
/** * @cat Effects/Animations
* A function for making your own, custom, animations. The key aspect of * @see fadeIn(String|Number,Function)
* this function is the object of style properties that will be animated, * @see fadeOut(String|Number,Function)
* and to what end. Each key within the object represents a style property */
* that will also be animated (for example: "height", "top", or "opacity"). fadeTo: function(speed,to,callback, transition){
* return this.animate({opacity: to}, speed, callback, transition);
* The value associated with the key represents to what end the property },
* will be animated. If a number is provided as the value, then the style
* property will be transitioned from its current state to that new number. /**
* Oterwise if the string "hide", "show", or "toggle" is provided, a default * A function for making your own, custom, animations. The key aspect of
* animation will be constructed for that property. * this function is the object of style properties that will be animated,
* * and to what end. Each key within the object represents a style property
* @example $("p").animate({ * that will also be animated (for example: "height", "top", or "opacity").
* height: 'toggle', opacity: 'toggle' *
* }, "slow"); * The value associated with the key represents to what end the property
* * will be animated. If a number is provided as the value, then the style
* @example $("p").animate({ * property will be transitioned from its current state to that new number.
* left: 50, opacity: 'show' * Oterwise if the string "hide", "show", or "toggle" is provided, a default
* }, 500); * animation will be constructed for that property.
* *
* @name animate * @example $("p").animate({
* @type jQuery * height: 'toggle', opacity: 'toggle'
* @param Hash params A set of style attributes that you wish to animate, and to what end. * }, "slow");
* @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000). *
* @param Function callback (optional) A function to be executed whenever the animation completes. * @example $("p").animate({
* @cat Effects/Animations * left: 50, opacity: 'show'
*/ * }, 500);
animate: function(prop,speed,callback) { *
return this.queue(function(){ * @name animate
* @type jQuery
this.curAnim = jQuery.extend({}, prop); * @param Hash params A set of style attributes that you wish to animate, and to what end.
* @param String|Number speed (optional) A string representing one of the three predefined speeds ("slow", "normal", or "fast") or the number of milliseconds to run the animation (e.g. 1000).
for ( var p in prop ) { * @param Function callback (optional) A function to be executed whenever the animation completes.
var e = new jQuery.fx( this, jQuery.speed(speed,callback), p ); * @param String transition (optional) Transition effect
if ( prop[p].constructor == Number ) * @cat Effects/Animations
e.custom( e.cur(), prop[p] ); */
else animate: function(prop,speed,callback, transition) {
e[ prop[p] ]( prop ); return this.queue(function(){
}
this.curAnim = jQuery.extend({}, prop);
});
}, for ( var p in prop ) {
var e = new jQuery.fx( this, jQuery.speed(speed,callback), p, transition );
/** if ( prop[p].constructor == Number )
* e.custom( e.cur(), prop[p] );
* @private else
*/ e[ prop[p] ]( prop );
queue: function(type,fn){ }
if ( !fn ) {
fn = type; });
type = "fx"; },
}
/**
return this.each(function(){ *
if ( !this.queue ) * @private
this.queue = {}; */
queue: function(type,fn){
if ( !this.queue[type] ) if ( !fn ) {
this.queue[type] = []; fn = type;
type = "fx";
this.queue[type].push( fn ); }
if ( this.queue[type].length == 1 ) return this.each(function(){
fn.apply(this); if ( !this.queue )
}); this.queue = {};
}
if ( !this.queue[type] )
}); this.queue[type] = [];
jQuery.extend({ this.queue[type].push( fn );
speed: function(s,o) { if ( this.queue[type].length == 1 )
o = o || {}; fn.apply(this);
});
if ( o.constructor == Function ) }
o = { complete: o };
});
var ss = { slow: 600, fast: 200 };
o.duration = (s && s.constructor == Number ? s : ss[s]) || 400; jQuery.extend({
// Queueing speed: function(s,o) {
o.oldComplete = o.complete; o = o || {};
o.complete = function(){
jQuery.dequeue(this, "fx"); if ( o.constructor == Function )
if ( o.oldComplete && o.oldComplete.constructor == Function ) o = { complete: o };
o.oldComplete.apply( this );
}; var ss = { slow: 600, fast: 200 };
o.duration = (s && s.constructor == Number ? s : ss[s]) || 400;
return o;
}, // Queueing
o.oldComplete = o.complete;
queue: {}, o.complete = function(){
jQuery.dequeue(this, "fx");
dequeue: function(elem,type){ if ( o.oldComplete && o.oldComplete.constructor == Function )
type = type || "fx"; o.oldComplete.apply( this );
};
if ( elem.queue && elem.queue[type] ) {
// Remove self return o;
elem.queue[type].shift(); },
// Get next function queue: {},
var f = elem.queue[type][0];
dequeue: function(elem,type){
if ( f ) f.apply( elem ); type = type || "fx";
}
}, if ( elem.queue && elem.queue[type] ) {
// Remove self
/* elem.queue[type].shift();
* I originally wrote fx() as a clone of moo.fx and in the process
* of making it small in size the code became illegible to sane // Get next function
* people. You've been warned. var f = elem.queue[type][0];
*/
if ( f ) f.apply( elem );
fx: function( elem, options, prop ){ }
},
var z = this;
/*
// The users options * I originally wrote fx() as a clone of moo.fx and in the process
z.o = { * of making it small in size the code became illegible to sane
duration: options.duration || 400, * people. You've been warned.
complete: options.complete, */
step: options.step
}; fx: function( elem, options, prop, transition ){
// The element var z = this;
z.el = elem;
// The users options
// The styles z.o = {
var y = z.el.style; duration: options.duration || 400,
complete: options.complete,
// Store display property step: options.step,
var oldDisplay = jQuery.css(z.el, 'display'); transition : /easein|easeout|easeboth|bouncein|bounceout|bounceboth|elasticin|elasticout|elasticboth/.test(transition) ? transition : 'original'
// Set display property to block for animation };
y.display = "block";
// Make sure that nothing sneaks out // The element
y.overflow = "hidden"; z.el = elem;
// Simple function for setting a style value // The styles
z.a = function(){ var y = z.el.style;
if ( options.step )
options.step.apply( elem, [ z.now ] ); // Store display property
var oldDisplay = jQuery.css(z.el, 'display');
if ( prop == "opacity" ) // Set display property to block for animation
jQuery.attr(y, "opacity", z.now); // Let attr handle opacity y.display = "block";
else if ( parseInt(z.now) ) // My hate for IE will never die // Make sure that nothing sneaks out
y[prop] = parseInt(z.now) + "px"; y.overflow = "hidden";
};
// Simple function for setting a style value
// Figure out the maximum number to run to z.a = function(){
z.max = function(){ if ( options.step )
return parseFloat( jQuery.css(z.el,prop) ); options.step.apply( elem, [ z.now ] );
};
if ( prop == "opacity" )
// Get the current size jQuery.attr(y, "opacity", z.now); // Let attr handle opacity
z.cur = function(){ else if ( parseInt(z.now) ) // My hate for IE will never die
var r = parseFloat( jQuery.curCSS(z.el, prop) ); y[prop] = parseInt(z.now) + "px";
return r && r > -10000 ? r : z.max(); };
};
// Figure out the maximum number to run to
// Start an animation from one number to another z.max = function(){
z.custom = function(from,to){ return parseFloat( jQuery.css(z.el,prop) );
z.startTime = (new Date()).getTime(); };
z.now = from;
z.a(); // Get the current size
z.cur = function(){
z.timer = setInterval(function(){ var r = parseFloat( jQuery.curCSS(z.el, prop) );
z.step(from, to); return r && r > -10000 ? r : z.max();
}, 13); };
};
// Start an animation from one number to another
// Simple 'show' function z.custom = function(from,to){
z.show = function(){ z.startTime = (new Date()).getTime();
if ( !z.el.orig ) z.el.orig = {}; z.now = from;
z.a();
// Remember where we started, so that we can go back to it later
z.el.orig[prop] = this.cur(); z.timer = setInterval(function(){
z.step(from, to);
z.o.show = true; }, 13);
};
// Begin the animation
z.custom(0, z.el.orig[prop]); // Simple 'show' function
z.show = function(){
// Stupid IE, look what you made me do if ( !z.el.orig ) z.el.orig = {};
if ( prop != "opacity" )
y[prop] = "1px"; // Remember where we started, so that we can go back to it later
}; z.el.orig[prop] = this.cur();
// Simple 'hide' function z.o.show = true;
z.hide = function(){
if ( !z.el.orig ) z.el.orig = {}; // Begin the animation
z.custom(0, z.el.orig[prop]);
// Remember where we started, so that we can go back to it later
z.el.orig[prop] = this.cur(); // Stupid IE, look what you made me do
if ( prop != "opacity" )
z.o.hide = true; y[prop] = "1px";
};
// Begin the animation
z.custom(z.el.orig[prop], 0); // Simple 'hide' function
}; z.hide = function(){
if ( !z.el.orig ) z.el.orig = {};
//Simple 'toggle' function
z.toggle = function() { // Remember where we started, so that we can go back to it later
if ( !z.el.orig ) z.el.orig = {}; z.el.orig[prop] = this.cur();
// Remember where we started, so that we can go back to it later z.o.hide = true;
z.el.orig[prop] = this.cur();
// Begin the animation
if(oldDisplay == 'none') { z.custom(z.el.orig[prop], 0);
z.o.show = true; };
// Stupid IE, look what you made me do //Simple 'toggle' function
if ( prop != "opacity" ) z.toggle = function() {
y[prop] = "1px"; if ( !z.el.orig ) z.el.orig = {};
// Begin the animation // Remember where we started, so that we can go back to it later
z.custom(0, z.el.orig[prop]); z.el.orig[prop] = this.cur();
} else {
z.o.hide = true; if(oldDisplay == 'none') {
z.o.show = true;
// Begin the animation
z.custom(z.el.orig[prop], 0); // Stupid IE, look what you made me do
} if ( prop != "opacity" )
}; y[prop] = "1px";
// Each step of an animation // Begin the animation
z.step = function(firstNum, lastNum){ z.custom(0, z.el.orig[prop]);
var t = (new Date()).getTime(); } else {
z.o.hide = true;
if (t > z.o.duration + z.startTime) {
// Stop the timer // Begin the animation
clearInterval(z.timer); z.custom(z.el.orig[prop], 0);
z.timer = null; }
};
z.now = lastNum;
z.a(); // Each step of an animation
z.step = function(firstNum, lastNum){
if (z.el.curAnim) z.el.curAnim[ prop ] = true; var t = (new Date()).getTime();
var done = true; if (t > z.o.duration + z.startTime) {
for ( var i in z.el.curAnim ) // Stop the timer
if ( z.el.curAnim[i] !== true ) clearInterval(z.timer);
done = false; z.timer = null;
if ( done ) { z.now = lastNum;
// Reset the overflow z.a();
y.overflow = '';
if (z.el.curAnim) z.el.curAnim[ prop ] = true;
// Reset the display
y.display = oldDisplay; var done = true;
if (jQuery.css(z.el, 'display') == 'none') for ( var i in z.el.curAnim )
y.display = 'block'; if ( z.el.curAnim[i] !== true )
done = false;
// Hide the element if the "hide" operation was done
if ( z.o.hide ) if ( done ) {
y.display = 'none'; // Reset the overflow
y.overflow = '';
// Reset the properties, if the item has been hidden or shown
if ( z.o.hide || z.o.show ) // Reset the display
for ( var p in z.el.curAnim ) y.display = oldDisplay;
if (p == "opacity") if (jQuery.css(z.el, 'display') == 'none')
jQuery.attr(y, p, z.el.orig[p]); y.display = 'block';
else
y[p] = ''; // Hide the element if the "hide" operation was done
} if ( z.o.hide )
y.display = 'none';
// If a callback was provided, execute it
if( done && z.o.complete && z.o.complete.constructor == Function ) // Reset the properties, if the item has been hidden or shown
// Execute the complete function if ( z.o.hide || z.o.show )
z.o.complete.apply( z.el ); for ( var p in z.el.curAnim )
} else { if (p == "opacity")
// Figure out where in the animation we are and set the number jQuery.attr(y, p, z.el.orig[p]);
var p = (t - this.startTime) / z.o.duration; else
z.now = ((-Math.cos(p*Math.PI)/2) + 0.5) * (lastNum-firstNum) + firstNum; y[p] = '';
}
// Perform the next step of the animation
z.a(); // If a callback was provided, execute it
} if( done && z.o.complete && z.o.complete.constructor == Function )
}; // Execute the complete function
z.o.complete.apply( z.el );
} } else {
var n = t - this.startTime;
}); // Figure out where in the animation we are and set the number
var p = n / z.o.duration;
//z.now = ((-Math.cos(p*Math.PI)/2) + 0.5) * (lastNum-firstNum) + firstNum;
z.now = jQuery.transitions(p, n, firstNum, (lastNum-firstNum), z.o.duration, z.o.transition);
// Perform the next step of the animation
z.a();
}
};
},
transitions : function(p, n, firstNum, delta, duration, type) {
var nm, m, a, s;
if (type == 'original') {
return ((-Math.cos(p*Math.PI)/2) + 0.5) * delta + firstNum;
}
if (type == 'easein') {
return delta*(n/=duration)*n*n + firstNum;
}
if (type == 'easeout') {
return -delta * ((n=n/duration-1)*n*n*n - 1) + firstNum;
}
if (type == 'easeboth') {
if ((n/=duration/2) < 1)
return delta/2*n*n*n*n + firstNum;
return -delta/2 * ((n-=2)*n*n*n - 2) + firstNum;
}
if (type == 'easeboth') {
if ((n/=duration/2) < 1)
return delta/2*n*n*n*n + firstNum;
return -delta/2 * ((n-=2)*n*n*n - 2) + firstNum;
}
if (type == 'bounceout') {
if ((n/=duration) < (1/2.75)) {
return delta*(7.5625*n*n) + firstNum;
} else if (n < (2/2.75)) {
return delta*(7.5625*(n-=(1.5/2.75))*n + .75) + firstNum;
} else if (n < (2.5/2.75)) {
return delta*(7.5625*(n-=(2.25/2.75))*n + .9375) + firstNum;
} else {
return delta*(7.5625*(n-=(2.625/2.75))*n + .984375) + firstNum;
}
}
if (type == 'bouncein') {
return delta - jQuery.transitions (p, duration - n, 0, delta, duration, 'bounceout') + firstNum;
}
if (type == 'bounceboth') {
if (n < duration/2) return jQuery.transitions(p, n*2, 0, delta, duration, 'bouncein') * .5 + firstNum;
return jQuery.transitions(p, n*2-duration, 0, delta, duration, 'bounceout') * .5 + delta*.5 + firstNum;
}
if (type == 'elasticin') {
if (n == 0)
return firstNum;
if ((n/=duration)==1)
return firstNum+delta;
a = delta * 0.3;
p=duration*.3;
if (a < Math.abs(delta)) {
a=delta;
s=p/4;
} else {
s = p/(2*Math.PI) * Math.asin (delta/a);
}
return -(a*Math.pow(2,10*(n-=1)) * Math.sin( (n*duration-s)*(2*Math.PI)/p )) + firstNum;
}
if (type == 'elasticout') {
if (n==0)
return firstNum;
if ((n/=duration/2)==2)
return firstNum + delta;
a = delta * 0.3;
p=duration*.3;
if (a < Math.abs(delta)){
a = delta;
s=p/4;
} else {
s = p/(2*Math.PI) * Math.asin (delta/a);
}
return a*Math.pow(2,-10*n) * Math.sin( (n*duration-s)*(2*Math.PI)/p ) + delta + firstNum;
}
if (type == 'elasticboth') {
if (n==0)
return firstNum;
if ((n/=duration/2)==2)
return firstNum + delta;
a = delta * 0.3;
p=duration*.3;
if (a < Math.abs(delta)){
a = delta;
s=p/4;
} else {
s = p/(2*Math.PI) * Math.asin (delta/a);
}
if (n < 1) {
return -.5*(a*Math.pow(2,10*(n-=1)) * Math.sin( (n*duration-s)*(2*Math.PI)/p )) + firstNum;
}
return a*Math.pow(2,-10*(n-=1)) * Math.sin( (n*duration-s)*(2*Math.PI)/p )*.5 + delta + firstNum;
}
}
});
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment