2 * jQuery UI Effects Scale 1.7.1
4 * Copyright (c) 2009 AUTHORS.txt (http://jqueryui.com/about)
5 * Dual licensed under the MIT (MIT-LICENSE.txt)
6 * and GPL (GPL-LICENSE.txt) licenses.
8 * http://docs.jquery.com/UI/Effects/Scale
15 $.effects
.puff = function(o
) {
17 return this.queue(function() {
23 var options
= $.extend(true, {}, o
.options
);
24 var mode
= $.effects
.setMode(el
, o
.options
.mode
|| 'hide'); // Set Mode
25 var percent
= parseInt(o
.options
.percent
,10) || 150; // Set default puff percent
26 options
.fade
= true; // It's not a puff if it doesn't fade! :)
27 var original
= {height
: el
.height(), width
: el
.width()}; // Save original
30 var factor
= percent
/ 100;
31 el
.from = (mode
== 'hide') ? original
: {height
: original
.height
* factor
, width
: original
.width
* factor
};
34 options
.from = el
.from;
35 options
.percent
= (mode
== 'hide') ? percent
: 100;
39 el
.effect('scale', options
, o
.duration
, o
.callback
);
45 $.effects
.scale = function(o
) {
47 return this.queue(function() {
53 var options
= $.extend(true, {}, o
.options
);
54 var mode
= $.effects
.setMode(el
, o
.options
.mode
|| 'effect'); // Set Mode
55 var percent
= parseInt(o
.options
.percent
,10) || (parseInt(o
.options
.percent
,10) == 0 ? 0 : (mode
== 'hide' ? 0 : 100)); // Set default scaling percent
56 var direction
= o
.options
.direction
|| 'both'; // Set default axis
57 var origin
= o
.options
.origin
; // The origin of the scaling
58 if (mode
!= 'effect') { // Set default origin and restore for show/hide
59 options
.origin
= origin
|| ['middle','center'];
60 options
.restore
= true;
62 var original
= {height
: el
.height(), width
: el
.width()}; // Save original
63 el
.from = o
.options
.from || (mode
== 'show' ? {height
: 0, width
: 0} : original
); // Default from state
66 var factor
= { // Set scaling factor
67 y
: direction
!= 'horizontal' ? (percent
/ 100) : 1,
68 x
: direction
!= 'vertical' ? (percent
/ 100) : 1
70 el
.to
= {height
: original
.height
* factor
.y
, width
: original
.width
* factor
.x
}; // Set to state
72 if (o
.options
.fade
) { // Fade option to support puff
73 if (mode
== 'show') {el
.from.opacity
= 0; el
.to
.opacity
= 1;};
74 if (mode
== 'hide') {el
.from.opacity
= 1; el
.to
.opacity
= 0;};
78 options
.from = el
.from; options
.to
= el
.to
; options
.mode
= mode
;
81 el
.effect('size', options
, o
.duration
, o
.callback
);
87 $.effects
.size = function(o
) {
89 return this.queue(function() {
92 var el
= $(this), props
= ['position','top','left','width','height','overflow','opacity'];
93 var props1
= ['position','top','left','overflow','opacity']; // Always restore
94 var props2
= ['width','height','overflow']; // Copy for children
95 var cProps
= ['fontSize'];
96 var vProps
= ['borderTopWidth', 'borderBottomWidth', 'paddingTop', 'paddingBottom'];
97 var hProps
= ['borderLeftWidth', 'borderRightWidth', 'paddingLeft', 'paddingRight'];
100 var mode
= $.effects
.setMode(el
, o
.options
.mode
|| 'effect'); // Set Mode
101 var restore
= o
.options
.restore
|| false; // Default restore
102 var scale
= o
.options
.scale
|| 'both'; // Default scale mode
103 var origin
= o
.options
.origin
; // The origin of the sizing
104 var original
= {height
: el
.height(), width
: el
.width()}; // Save original
105 el
.from = o
.options
.from || original
; // Default from state
106 el
.to
= o
.options
.to
|| original
; // Default to state
108 if (origin
) { // Calculate baseline shifts
109 var baseline
= $.effects
.getBaseline(origin
, original
);
110 el
.from.top
= (original
.height
- el
.from.height
) * baseline
.y
;
111 el
.from.left
= (original
.width
- el
.from.width
) * baseline
.x
;
112 el
.to
.top
= (original
.height
- el
.to
.height
) * baseline
.y
;
113 el
.to
.left
= (original
.width
- el
.to
.width
) * baseline
.x
;
115 var factor
= { // Set scaling factor
116 from: {y
: el
.from.height
/ original
.height
, x
: el
.from.width
/ original
.width
},
117 to
: {y
: el
.to
.height
/ original
.height
, x
: el
.to
.width
/ original
.width
}
119 if (scale
== 'box' || scale
== 'both') { // Scale the css box
120 if (factor
.from.y
!= factor
.to
.y
) { // Vertical props scaling
121 props
= props
.concat(vProps
);
122 el
.from = $.effects
.setTransition(el
, vProps
, factor
.from.y
, el
.from);
123 el
.to
= $.effects
.setTransition(el
, vProps
, factor
.to
.y
, el
.to
);
125 if (factor
.from.x
!= factor
.to
.x
) { // Horizontal props scaling
126 props
= props
.concat(hProps
);
127 el
.from = $.effects
.setTransition(el
, hProps
, factor
.from.x
, el
.from);
128 el
.to
= $.effects
.setTransition(el
, hProps
, factor
.to
.x
, el
.to
);
131 if (scale
== 'content' || scale
== 'both') { // Scale the content
132 if (factor
.from.y
!= factor
.to
.y
) { // Vertical props scaling
133 props
= props
.concat(cProps
);
134 el
.from = $.effects
.setTransition(el
, cProps
, factor
.from.y
, el
.from);
135 el
.to
= $.effects
.setTransition(el
, cProps
, factor
.to
.y
, el
.to
);
138 $.effects
.save(el
, restore
? props
: props1
); el
.show(); // Save & Show
139 $.effects
.createWrapper(el
); // Create Wrapper
140 el
.css('overflow','hidden').css(el
.from); // Shift
143 if (scale
== 'content' || scale
== 'both') { // Scale the children
144 vProps
= vProps
.concat(['marginTop','marginBottom']).concat(cProps
); // Add margins/font-size
145 hProps
= hProps
.concat(['marginLeft','marginRight']); // Add margins
146 props2
= props
.concat(vProps
).concat(hProps
); // Concat
147 el
.find("*[width]").each(function(){
149 if (restore
) $.effects
.save(child
, props2
);
150 var c_original
= {height
: child
.height(), width
: child
.width()}; // Save original
151 child
.from = {height
: c_original
.height
* factor
.from.y
, width
: c_original
.width
* factor
.from.x
};
152 child
.to
= {height
: c_original
.height
* factor
.to
.y
, width
: c_original
.width
* factor
.to
.x
};
153 if (factor
.from.y
!= factor
.to
.y
) { // Vertical props scaling
154 child
.from = $.effects
.setTransition(child
, vProps
, factor
.from.y
, child
.from);
155 child
.to
= $.effects
.setTransition(child
, vProps
, factor
.to
.y
, child
.to
);
157 if (factor
.from.x
!= factor
.to
.x
) { // Horizontal props scaling
158 child
.from = $.effects
.setTransition(child
, hProps
, factor
.from.x
, child
.from);
159 child
.to
= $.effects
.setTransition(child
, hProps
, factor
.to
.x
, child
.to
);
161 child
.css(child
.from); // Shift children
162 child
.animate(child
.to
, o
.duration
, o
.options
.easing
, function(){
163 if (restore
) $.effects
.restore(child
, props2
); // Restore children
164 }); // Animate children
169 el
.animate(el
.to
, { queue
: false, duration
: o
.duration
, easing
: o
.options
.easing
, complete: function() {
170 if(mode
== 'hide') el
.hide(); // Hide
171 $.effects
.restore(el
, restore
? props
: props1
); $.effects
.removeWrapper(el
); // Restore
172 if(o
.callback
) o
.callback
.apply(this, arguments
); // Callback