mirror of
https://github.com/jquery/jquery-ui.git
synced 2026-05-13 03:01:39 -04:00
1. Introduces a set of helper methods to easily create and define new effects. 2. Uses clip animations and placeholders instead of wrappers for clip effects. 3. Ensures all animations are detectable as animated Fixes #10599 Fixes #9477 Fixes #9257 Fixes #9066 Fixes #8867 Fixes #8671 Fixes #8505 Fixes #7885 Fixes #7041 Closes gh-1017
68 lines
1.5 KiB
JavaScript
68 lines
1.5 KiB
JavaScript
/*!
|
|
* jQuery UI Effects Drop @VERSION
|
|
* http://jqueryui.com
|
|
*
|
|
* Copyright 2014 jQuery Foundation and other contributors
|
|
* Released under the MIT license.
|
|
* http://jquery.org/license
|
|
*/
|
|
|
|
//>>label: Drop Effect
|
|
//>>group: Effects
|
|
//>>description: Moves an element in one direction and hides it at the same time.
|
|
//>>docs: http://api.jqueryui.com/drop-effect/
|
|
//>>demos: http://jqueryui.com/effect/
|
|
|
|
(function( factory ) {
|
|
if ( typeof define === "function" && define.amd ) {
|
|
|
|
// AMD. Register as an anonymous module.
|
|
define([
|
|
"jquery",
|
|
"./effect"
|
|
], factory );
|
|
} else {
|
|
|
|
// Browser globals
|
|
factory( jQuery );
|
|
}
|
|
}(function( $ ) {
|
|
|
|
return $.effects.define( "drop", "hide", function( options, done ) {
|
|
|
|
var distance,
|
|
element = $( this ),
|
|
mode = options.mode,
|
|
show = mode === "show",
|
|
direction = options.direction || "left",
|
|
ref = ( direction === "up" || direction === "down" ) ? "top" : "left",
|
|
motion = ( direction === "up" || direction === "left" ) ? "-=" : "+=",
|
|
oppositeMotion = ( motion === "+=" ) ? "-=" : "+=",
|
|
animation = {
|
|
opacity: 0
|
|
};
|
|
|
|
$.effects.createPlaceholder( element );
|
|
|
|
distance = options.distance || element[ ref === "top" ? "outerHeight" : "outerWidth" ]( true ) / 2;
|
|
|
|
animation[ ref ] = motion + distance;
|
|
|
|
if ( show ) {
|
|
element.css( animation );
|
|
|
|
animation[ ref ] = oppositeMotion + distance;
|
|
animation.opacity = 1;
|
|
}
|
|
|
|
// Animate
|
|
element.animate( animation, {
|
|
queue: false,
|
|
duration: options.duration,
|
|
easing: options.easing,
|
|
complete: done
|
|
});
|
|
});
|
|
|
|
}));
|