effect-fold.js (2133B)
1 /*! 2 * jQuery UI Effects Fold 1.12.1 3 * http://jqueryui.com 4 * 5 * Copyright jQuery Foundation and other contributors 6 * Released under the MIT license. 7 * http://jquery.org/license 8 */ 9 10 //>>label: Fold Effect 11 //>>group: Effects 12 //>>description: Folds an element first horizontally and then vertically. 13 //>>docs: http://api.jqueryui.com/fold-effect/ 14 //>>demos: http://jqueryui.com/effect/ 15 16 ( function( factory ) { 17 if ( typeof define === "function" && define.amd ) { 18 19 // AMD. Register as an anonymous module. 20 define( [ 21 "jquery", 22 "./effect" 23 ], factory ); 24 } else { 25 26 // Browser globals 27 factory( jQuery ); 28 } 29 }( function( $ ) { 30 31 return $.effects.define( "fold", "hide", function( options, done ) { 32 33 // Create element 34 var element = $( this ), 35 mode = options.mode, 36 show = mode === "show", 37 hide = mode === "hide", 38 size = options.size || 15, 39 percent = /([0-9]+)%/.exec( size ), 40 horizFirst = !!options.horizFirst, 41 ref = horizFirst ? [ "right", "bottom" ] : [ "bottom", "right" ], 42 duration = options.duration / 2, 43 44 placeholder = $.effects.createPlaceholder( element ), 45 46 start = element.cssClip(), 47 animation1 = { clip: $.extend( {}, start ) }, 48 animation2 = { clip: $.extend( {}, start ) }, 49 50 distance = [ start[ ref[ 0 ] ], start[ ref[ 1 ] ] ], 51 52 queuelen = element.queue().length; 53 54 if ( percent ) { 55 size = parseInt( percent[ 1 ], 10 ) / 100 * distance[ hide ? 0 : 1 ]; 56 } 57 animation1.clip[ ref[ 0 ] ] = size; 58 animation2.clip[ ref[ 0 ] ] = size; 59 animation2.clip[ ref[ 1 ] ] = 0; 60 61 if ( show ) { 62 element.cssClip( animation2.clip ); 63 if ( placeholder ) { 64 placeholder.css( $.effects.clipToBox( animation2 ) ); 65 } 66 67 animation2.clip = start; 68 } 69 70 // Animate 71 element 72 .queue( function( next ) { 73 if ( placeholder ) { 74 placeholder 75 .animate( $.effects.clipToBox( animation1 ), duration, options.easing ) 76 .animate( $.effects.clipToBox( animation2 ), duration, options.easing ); 77 } 78 79 next(); 80 } ) 81 .animate( animation1, duration, options.easing ) 82 .animate( animation2, duration, options.easing ) 83 .queue( done ); 84 85 $.effects.unshift( element, queuelen, 4 ); 86 } ); 87 88 } ) );