library-mirrors/jquery-ui
1
0
Fork 0
mirror of https://github.com/jquery/jquery-ui.git synced 2024-11-21 11:04:24 +00:00
Code Issues Actions Packages Projects Releases Wiki Activity

Rewrote animateClass to work in webkit. Fixes #3112 - SwitchClass doesn't have any effect in Safari 3.1.1.

Browse Source 
Based on trunk and effects dev branch implementations.
This commit is contained in:
Scott González 2009-09-18 13:15:57 +00:00
parent 20201c2854
commit 6f1b0d80be
1 changed files with 107 additions and 28 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

135
ui/jquery.effects.core.js vendored
View File

@ -93,44 +93,123 @@ $.effects = {
//Base function to animate from one class to another in a seamless transition //Base function to animate from one class to another in a seamless transition
animateClass: function(value, duration, easing, callback) { animateClass: function(value, duration, easing, callback) {
if ($.isFunction(easing)) {
var cb = (typeof easing == "function" ? easing : (callback ? callback : null)); callback = easing;
var ea = (typeof easing == "string" ? easing : null); easing = null;
}
return this.each(function() { return this.each(function() {
var offset = {}; var that = $(this); var oldStyleAttr = that.attr("style") || ''; var that = $(this),
if(typeof oldStyleAttr == 'object') oldStyleAttr = oldStyleAttr["cssText"]; /* Stupidly in IE, style is a object.. */ originalStyleAttr = that.attr('style') || ' ',
if(value.toggle) { that.hasClass(value.toggle) ? value.remove = value.toggle : value.add = value.toggle; } originalStyle = filterStyles(getElementStyles.call(this)),
newStyle;
//Let's get a style offset $.each(classAnimationActions, function(action) {
var oldStyle = $.extend({}, (document.defaultView ? document.defaultView.getComputedStyle(this,null) : this.currentStyle)); if (value[action]) {
if(value.add) that.addClass(value.add); if(value.remove) that.removeClass(value.remove); that[action + 'Class'](value[action]);
var newStyle = $.extend({}, (document.defaultView ? document.defaultView.getComputedStyle(this,null) : this.currentStyle)); }
if(value.add) that.removeClass(value.add); if(value.remove) that.addClass(value.remove); });
newStyle = filterStyles(getElementStyles.call(this));
// The main function to form the object for animation $.each(classAnimationActions, function(action, reverse) {
for(var n in newStyle) { if (value[action]) {
if( typeof newStyle[n] != "function" && newStyle[n] /* No functions and null properties */ that[reverse + 'Class'](value[action]);
&& n.indexOf("Moz") == -1 && n.indexOf("length") == -1 /* No mozilla spezific render properties. */ }
&& n.indexOf("scrollbar") == -1 /* No scrollbar properties - causes problems in IE */
&& newStyle[n] != oldStyle[n] /* Only values that have changed are used for the animation */
&& (n.match(/color/i) || (!n.match(/color/i) && !isNaN(parseInt(newStyle[n],10)))) /* Only things that can be parsed to integers or colors */
&& (oldStyle.position != "static" || (oldStyle.position == "static" && !n.match(/left|top|bottom|right/))) /* No need for positions when dealing with static positions */
) offset[n] = newStyle[n];
}
that.animate(offset, duration, ea, function() { // Animate the newly constructed offset object
// Change style attribute back to original. For stupid IE, we need to clear the damn object.
if(typeof $(this).attr("style") == 'object') { $(this).attr("style")["cssText"] = ""; $(this).attr("style")["cssText"] = oldStyleAttr; } else $(this).attr("style", oldStyleAttr);
if(value.add) $(this).addClass(value.add); if(value.remove) $(this).removeClass(value.remove);
if(cb) cb.apply(this, arguments);
}); });
that.animate(styleDifference(originalStyle, newStyle), duration, easing, function() {
$.each(classAnimationActions, function(action) {
if (value[action]) { that[action + 'Class'](value[action]); }
});
// work around bug in IE by clearing the cssText before setting it
if (typeof that.attr('style') == 'object') {
that.attr('style').cssText = '';
that.attr('style').cssText = originalStyleAttr;
} else {
that.attr('style', originalStyleAttr);
}
if (callback) { callback.apply(this, arguments); }
});
}); });
} }
}; };
// start class animations
var classAnimationActions = {
add: 'remove',
remove: 'add',
toggle: 'toggle'
};
function getElementStyles() {
var style = document.defaultView
? document.defaultView.getComputedStyle(this, null)
: this.currentStyle,
newStyle = {},
key,
camelCase;
// webkit enumerates style porperties
if (style && style.length && style[0] && style[style[0]]) {
var len = style.length;
while (len--) {
key = style[len];
if (typeof style[key] == 'string') {
camelCase = key.replace(/\-(\w)/g, function(all, letter){
return letter.toUpperCase();
});
newStyle[camelCase] = style[key];
}
}
} else {
for (key in style) {
if (typeof style[key] === 'string') {
newStyle[key] = style[key];
}
}
}
return newStyle;
}
function filterStyles(styles) {
var name, value;
for (name in styles) {
value = styles[name];
if (
// ignore null and undefined values
value == null ||
// ignore functions (when does this occur?)
$.isFunction(value) ||
// ignore Mozilla specific styles (Moz and length)
// ignore scrollbars (break in IE)
(/(Moz)|(length)|(scrollbar)/).test(name) ||
// only colors or values that can be converted to numbers
(!(/color/i).test(name) && isNaN(parseFloat(value)))
) {
delete styles[name];
}
}
return styles;
}
function styleDifference(oldStyle, newStyle) {
var diff = {},
name;
for (name in newStyle) {
if (oldStyle[name] != newStyle[name]) {
diff[name] = newStyle[name];
}
}
return diff;
}
// end class animations
function _normalizeArguments(effect, options, speed, callback) { function _normalizeArguments(effect, options, speed, callback) {
// shift params for method overloading // shift params for method overloading