Added Opera 10+ CSS3 transforms, transitions

Added support for CSS3 transforms and transitions in Opera 10+ for Windows, which enables double tap zoom and better animation.
dimsemenov · Oct 7, 2012 · a5da942 · a5da942
1 parent bbdf168
commit a5da942
Show file tree

Hide file tree

Showing 4 changed files with 8 additions and 7 deletions.
diff --git a/src/carousel.class.animation.js b/src/carousel.class.animation.js
@@ -80,7 +80,7 @@
 
 			if (Util.Browser.isCSSTransformSupported){
 
-				transform = Util.coalesce(this.contentEl.style.webkitTransform, this.contentEl.style.MozTransform, this.contentEl.style.transform, '');
+				transform = Util.coalesce(this.contentEl.style.webkitTransform, this.contentEl.style.MozTransform, this.contentEl.style.OTransform, this.contentEl.style.transform, '');
 				if (transform.indexOf('translate3d(' + xVal) === 0){
 					this.slideByEndHandler();
 					return;

diff --git a/src/lib/code.util-1.0.6/src/animation.js b/src/lib/code.util-1.0.6/src/animation.js
@@ -10,13 +10,13 @@
 
 			_applyTransitionDelay: 50,
 
-			_transitionEndLabel: (window.document.documentElement.style.webkitTransition !== undefined) ? "webkitTransitionEnd" : "transitionend",
+			_transitionEndLabel: (window.document.documentElement.style.webkitTransition !== undefined) ? "webkitTransitionEnd" : (window.document.documentElement.style.OTransition !== undefined) ? "oTransitionEnd otransitionend" : "transitionend",
 
 			_transitionEndHandler: null,
 
-			_transitionPrefix: (window.document.documentElement.style.webkitTransition !== undefined) ? "webkitTransition" : (window.document.documentElement.style.MozTransition !== undefined) ? "MozTransition" : "transition",
+			_transitionPrefix: (window.document.documentElement.style.webkitTransition !== undefined) ? "webkitTransition" : (window.document.documentElement.style.MozTransition !== undefined) ? "MozTransition" : (window.document.documentElement.style.OTransition !== undefined) ? "OTransition" : "transition",
 
-			_transformLabel: (window.document.documentElement.style.webkitTransform !== undefined) ? "webkitTransform" : (window.document.documentElement.style.MozTransition !== undefined) ? "MozTransform" : "transform",
+			_transformLabel: (window.document.documentElement.style.webkitTransform !== undefined) ? "webkitTransform" : (window.document.documentElement.style.MozTransform !== undefined) ? "MozTransform" : (window.document.documentElement.style.OTransform !== undefined) ? "OTransform" : "transform",
 
 
 			/*
@@ -249,7 +249,7 @@
 						property = el.style[this._transitionPrefix + 'Property'],
 						callbackLabel = (property !== '') ? 'ccl' + property + 'callback' : 'cclallcallback',
 						callback,
-						transform = Util.coalesce(el.style.webkitTransform, el.style.MozTransform, el.style.transform),
+						transform = Util.coalesce(el.style.webkitTransform, el.style.MozTransform, el.style.OTransform, el.style.transform),
 						transformMatch, 
 						transformExploded,
 						domX = window.parseInt(Util.DOM.getStyle(el, 'left'), 0),

diff --git a/src/lib/code.util-1.0.6/src/browser.js b/src/lib/code.util-1.0.6/src/browser.js
@@ -49,7 +49,7 @@
 
 			var testEl = document.createElement('div');
 			this.is3dSupported = !Util.isNothing(testEl.style.WebkitPerspective);	
-			this.isCSSTransformSupported = ( !Util.isNothing(testEl.style.WebkitTransform) || !Util.isNothing(testEl.style.MozTransform) || !Util.isNothing(testEl.style.transformProperty) );
+			this.isCSSTransformSupported = ( !Util.isNothing(testEl.style.WebkitTransform) || !Util.isNothing(testEl.style.MozTransform) || !Util.isNothing(testEl.style.OTransform) || !Util.isNothing(testEl.style.transformProperty) );
 			this.isTouchSupported = this.isEventSupported('touchstart');
 			this.isGestureSupported = this.isEventSupported('gesturestart');
 

diff --git a/src/zoompanrotate.class.js b/src/zoompanrotate.class.js
@@ -133,7 +133,7 @@
 		setStartingTranslateFromCurrentTransform: function(){
 
 			var 
-				transformValue = Util.coalesce(this.transformEl.style.webkitTransform, this.transformEl.style.MozTransform, this.transformEl.style.transform),
+				transformValue = Util.coalesce(this.transformEl.style.webkitTransform, this.transformEl.style.MozTransform, this.transformEl.style.OTransform, this.transformEl.style.transform),
 				transformExploded;
 
 			if (!Util.isNothing(transformValue)){
@@ -297,6 +297,7 @@
 				webkitTransform: transform,
 				MozTransform: transform,
 				msTransform: transform,
+				OTransform: transform,
 				transform: transform
 			});