From 7c41a7d5e910d7c9791e61ac16c13f4d988f03ba Mon Sep 17 00:00:00 2001
From: Aleks Totic
Date: Fri, 12 Oct 2012 11:34:41 -0700
Subject: [PATCH 1/3] 2 bugfixes for transform syntax
---
jquery.transit.js | 6 +++---
1 file changed, 3 insertions(+), 3 deletions(-)
diff --git a/jquery.transit.js b/jquery.transit.js
index 3ebae61..b6bbb56 100644
--- a/jquery.transit.js
+++ b/jquery.transit.js
@@ -310,8 +310,8 @@
if (this._translateX === undefined) { this._translateX = 0; }
if (this._translateY === undefined) { this._translateY = 0; }
- if (x !== null) { this._translateX = unit(x, 'px'); }
- if (y !== null) { this._translateY = unit(y, 'px'); }
+ if (x !== null && x !== undefined) { this._translateX = unit(x, 'px'); }
+ if (y !== null && y !== undefined) { this._translateY = unit(y, 'px'); }
this.translate = this._translateX + "," + this._translateY;
}
@@ -405,7 +405,7 @@
$.each(props, function(key) {
key = $.camelCase(key); // Convert "text-align" => "textAlign"
- key = $.transit.propertyMap[key] || key;
+ key = $.transit.propertyMap[key] || $.cssProps[key] || key;
key = uncamel(key); // Convert back to dasherized
if ($.inArray(key, re) === -1) { re.push(key); }
From 51589f1401a9d4ebe7fedf4b4566e7c139003083 Mon Sep 17 00:00:00 2001
From: Aleks Totic
Date: Fri, 12 Oct 2012 11:53:12 -0700
Subject: [PATCH 2/3] Added support for backfaceVisibility and
transitionTimingFunction
---
jquery.transit.js | 32 +++++++++++++++++++++++++++++++-
1 file changed, 31 insertions(+), 1 deletion(-)
diff --git a/jquery.transit.js b/jquery.transit.js
index b6bbb56..a728b04 100644
--- a/jquery.transit.js
+++ b/jquery.transit.js
@@ -69,6 +69,8 @@
support.transform = getVendorPropertyName('transform');
support.transformOrigin = getVendorPropertyName('transformOrigin');
support.transform3d = checkTransform3dSupport();
+ support.backfaceVisibility = getVendorPropertyName('backfaceVisibility');
+ support.transitionTimingFunction = getVendorPropertyName('transitionTimingFunction');
$.extend($.support, support);
@@ -150,7 +152,7 @@
// ## 'transition' CSS hook
// Allows you to use the `transition` property in CSS.
//
- // $("#hello").css({ transition: 'all 0 ease 0' });
+ // $("#hello").css({ transition: 'all 0 ease 0' });
//
$.cssHooks.transition = {
get: function(elem) {
@@ -161,6 +163,34 @@
}
};
+ // ## 'backfaceVisibility' CSS hook
+ // Allows the use for `backfaceVisibilty` to hide back of transormed elements
+ //
+ // $("#hello").css({ backfaceVisibilty: 'hidden' });
+
+ $.cssHooks.backfaceVisibility = {
+ get: function(elem) {
+ return elem.style[support.backfaceVisibility];
+ },
+ set: function(elem, value) {
+ elem.style[support.backfaceVisibility] = value;
+ }
+ };
+
+ // ## 'transition-timing-function' CSS hook
+ // Allows the use for `transition-timing-function` to fine tune animation
+ //
+ // $("#hello").css({ transitionTimingFunction: 'cubic-bezier(0,0.4,0.4,0)' });
+ //
+ $.cssHooks.transitionTimingFunction = {
+ get: function(elem) {
+ return elem.style[support.transitionTimingFunction];
+ },
+ set: function(elem, value) {
+ elem.style[support.transitionTimingFunction] = value;
+ }
+ };
+
// ## Other CSS hooks
// Allows you to rotate, scale and translate.
registerCssHook('scale');
From 4273dccc5d1d23705abca65b047bcb57d92d80b5 Mon Sep 17 00:00:00 2001
From: Aleks Totic
Date: Fri, 12 Oct 2012 12:00:34 -0700
Subject: [PATCH 3/3] Force repaint without timeout, pull request from
jquery.transit
---
jquery.transit.js | 9 ++-------
1 file changed, 2 insertions(+), 7 deletions(-)
diff --git a/jquery.transit.js b/jquery.transit.js
index a728b04..f7208c1 100644
--- a/jquery.transit.js
+++ b/jquery.transit.js
@@ -609,13 +609,8 @@
// Defer running. This allows the browser to paint any pending CSS it hasn't
// painted yet before doing the transitions.
var deferredRun = function(next) {
- var i = 0;
-
- // Durations that are too slow will get transitions mixed up.
- // (Tested on Mac/FF 7.0.1)
- if ((support.transition === 'MozTransition') && (i < 25)) { i = 25; }
-
- window.setTimeout(function() { run(next); }, i);
+ this.offsetWidth; // force a repaint
+ run(next);
};
// Use jQuery's fx queue.