使用http://jsfiddle.net/heygrady/j5tHC/light/作为我的示例,尝试更新到当前的jQuery,在我的情况下为1.11.0
与jQuery 1.6.2一起使用,当我更新到当前版本时,它会在控制台中抛出错误," TypeError:f未定义"我无法弄清楚为什么它会产生影响或跟踪变量,看起来两者中的值都相同。
以下代码运行动画:
tween($.curve.bezier, {
x: 0,
y: $canvas[0].height,
points: [
[0, $canvas[0].height / 2],
[$canvas[0].width * 0.5, 0],
[$canvas[0].width * 0.9, $canvas[0].height],
[$canvas[0].width, $canvas[0].height/ 2]
]
});
我相信这是打破插件的功能:
(function (f, g, j, b) {
var h = /progid:DXImageTransform\.Microsoft\.Matrix\(.*?\)/,
c = /^([\+\-]=)?([\d+.\-]+)(.*)$/,
q = /%/;
var d = j.createElement('modernizr'),
e = d.style;
function n(s) {
return parseFloat(s)
}
function l() {
var s = {
transformProperty: '',
MozTransform: '-moz-',
WebkitTransform: '-webkit-',
OTransform: '-o-',
msTransform: '-ms-'
};
for (var t in s) {
if (typeof e[t] != 'undefined') {
return s[t]
}
}
return null
}
function r() {
if (typeof (g.Modernizr) !== 'undefined') {
return Modernizr.csstransforms
}
var t = [
'transformProperty',
'WebkitTransform',
'MozTransform',
'OTransform',
'msTransform'
];
for (var s in t) {
if (e[t[s]] !== b) {
return true
}
}
}
var a = l(),
i = a !== null ? a + 'transform' : false,
k = a !== null ? a + 'transform-origin' : false;
f.support.csstransforms = r();
if (a == '-ms-') {
i = 'msTransform';
k = 'msTransformOrigin'
}
f.extend({
transform: function (s) {
s.transform = this;
this.$elem = f(s);
this.applyingMatrix = false;
this.matrix = null;
this.height = null;
this.width = null;
this.outerHeight = null;
this.outerWidth = null;
this.boxSizingValue = null;
this.boxSizingProperty = null;
this.attr = null;
this.transformProperty = i;
this.transformOriginProperty = k
}
});
f.extend(f.transform, {
funcs: [
'matrix',
'origin',
'reflect',
'reflectX',
'reflectXY',
'reflectY',
'rotate',
'scale',
'scaleX',
'scaleY',
'skew',
'skewX',
'skewY',
'translate',
'translateX',
'translateY'
]
});
f.fn.transform = function (s, t) {
return this.each(function () {
var u = this.transform || new f.transform(this);
if (s) {
u.exec(s, t)
}
})
};
f.transform.prototype = {
exec: function (s, t) {
t = f.extend(true, {
forceMatrix: false,
preserve: false
}, t);
this.attr = null;
if (t.preserve) {
s = f.extend(true, this.getAttrs(true, true), s)
} else {
s = f.extend(true, {
}, s)
}
this.setAttrs(s);
if (f.support.csstransforms && !t.forceMatrix) {
return this.execFuncs(s)
} else {
if (f.browser.msie || (f.support.csstransforms && t.forceMatrix)) {
return this.execMatrix(s)
}
}
return false
},
execFuncs: function (t) {
var s = [
];
for (var u in t) {
if (u == 'origin') {
this[u].apply(this, f.isArray(t[u]) ? t[u] : [
t[u]
])
} else {
if (f.inArray(u, f.transform.funcs) !== - 1) {
s.push(this.createTransformFunc(u, t[u]))
}
}
}
this.$elem.css(i, s.join(' '));
return true
},
execMatrix: function (z) {
var C,
x,
t;
var F = this.$elem[0],
B = this;
function A(N, M) {
if (q.test(N)) {
return parseFloat(N) / 100 * B['safeOuter' + (M ? 'Height' : 'Width')]()
}
return o(F, N)
}
var s = /translate[X|Y]?/,
u = [
];
for (var v in z) {
switch (f.type(z[v])) {
case 'array':
t = z[v];
break;
case 'string':
t = f.map(z[v].split(','), f.trim);
break;
default:
t = [
z[v]
]
}
if (f.matrix[v]) {
if (f.cssAngle[v]) {
t = f.map(t, f.angle.toDegree)
} else {
if (!f.cssNumber[v]) {
t = f.map(t, A)
} else {
t = f.map(t, n)
}
}
x = f.matrix[v].apply(this, t);
if (s.test(v)) {
u.push(x)
} else {
C = C ? C.x(x) : x
}
} else {
if (v == 'origin') {
this[v].apply(this, t)
}
}
}
C = C || f.matrix.identity();
f.each(u, function (M, N) {
C = C.x(N)
});
var K = parseFloat(C.e(1, 1) .toFixed(6)),
I = parseFloat(C.e(2, 1) .toFixed(6)),
H = parseFloat(C.e(1, 2) .toFixed(6)),
G = parseFloat(C.e(2, 2) .toFixed(6)),
L = C.rows === 3 ? parseFloat(C.e(1, 3) .toFixed(6)) : 0,
J = C.rows === 3 ? parseFloat(C.e(2, 3) .toFixed(6)) : 0;
if (f.support.csstransforms && a === '-moz-') {
this.$elem.css(i, 'matrix(' + K + ', ' + I + ', ' + H + ', ' + G + ', ' + L + 'px, ' + J + 'px)')
} else {
if (f.support.csstransforms) {
this.$elem.css(i, 'matrix(' + K + ', ' + I + ', ' + H + ', ' + G + ', ' + L + ', ' + J + ')')
} else {
if (f.browser.msie) {
var w = ', FilterType=\'nearest neighbor\'';
var D = this.$elem[0].style;
var E = 'progid:DXImageTransform.Microsoft.Matrix(M11=' + K + ', M12=' + H + ', M21=' + I + ', M22=' + G + ', sizingMethod=\'auto expand\'' + w + ')';
var y = D.filter || f.curCSS(this.$elem[0], 'filter') || '';
D.filter = h.test(y) ? y.replace(h, E) : y ? y + ' ' + E : E;
this.applyingMatrix = true;
this.matrix = C;
this.fixPosition(C, L, J);
this.applyingMatrix = false;
this.matrix = null
}
}
}
return true
},
origin: function (s, t) {
if (f.support.csstransforms) {
if (typeof t === 'undefined') {
this.$elem.css(k, s)
} else {
this.$elem.css(k, s + ' ' + t)
}
return true
}
switch (s) {
case 'left':
s = '0';
break;
case 'right':
s = '100%';
break;
case 'center':
case b:
s = '50%'
}
switch (t) {
case 'top':
t = '0';
break;
case 'bottom':
t = '100%';
break;
case 'center':
case b:
t = '50%'
}
this.setAttr('origin', [
q.test(s) ? s : o(this.$elem[0], s) + 'px',
q.test(t) ? t : o(this.$elem[0], t) + 'px'
]);
return true
},
createTransformFunc: function (t, u) {
if (t.substr(0, 7) === 'reflect') {
var s = u ? f.matrix[t]() : f.matrix.identity();
return 'matrix(' + s.e(1, 1) + ', ' + s.e(2, 1) + ', ' + s.e(1, 2) + ', ' + s.e(2, 2) + ', 0, 0)'
}
if (t == 'matrix') {
if (a === '-moz-') {
u[4] = u[4] ? u[4] + 'px' : 0;
u[5] = u[5] ? u[5] + 'px' : 0
}
}
return t + '(' + (f.isArray(u) ? u.join(', ') : u) + ')'
},
fixPosition: function (B, y, x, D, s) {
var w = new f.matrix.calc(B, this.safeOuterHeight(), this.safeOuterWidth()),
C = this.getAttr('origin');
var v = w.originOffset(new f.matrix.V2(q.test(C[0]) ? parseFloat(C[0]) / 100 * w.outerWidth : parseFloat(C[0]), q.test(C[1]) ? parseFloat(C[1]) / 100 * w.outerHeight : parseFloat(C[1])));
var t = w.sides();
var u = this.$elem.css('position');
if (u == 'static') {
u = 'relative'
}
var A = {
top: 0,
left: 0
};
var z = {
position: u,
top: (v.top + x + t.top + A.top) + 'px',
left: (v.left + y + t.left + A.left) + 'px',
zoom: 1
};
this.$elem.css(z)
}
};
function o(s, u) {
var t = c.exec(f.trim(u));
if (t[3] && t[3] !== 'px') {
var w = 'paddingBottom',
v = f.style(s, w);
f.style(s, w, u);
u = p(s, w);
f.style(s, w, v);
return u
}
return parseFloat(u)
}
function p(t, u) {
if (t[u] != null && (!t.style || t.style[u] == null)) {
return t[u]
}
var s = parseFloat(f.css(t, u));
return s && s > - 10000 ? s : 0
}
}) (jQuery, this, this.document);