a bit cleaner zoom anim logic

dist/leaflet.css

@@ -146,8 +146,7 @@
 	        transition:         transform 0.25s cubic-bezier(0,0,0.25,1);
 	}
 .leaflet-zoom-anim .leaflet-tile,
-.leaflet-pan-anim .leaflet-tile,
-.leaflet-touching .leaflet-zoom-animated {
+.leaflet-pan-anim .leaflet-tile {
 	-webkit-transition: none;
 	   -moz-transition: none;
 	     -o-transition: none;

src/layer/tile/GridLayer.js

@@ -111,6 +111,7 @@ L.GridLayer = L.Layer.extend({
 		}
 
 		if (this._zoomAnimated) {
+			events.zoomanimstart = this._startZoomAnim;
 			events.zoomanim = this._animateZoom;
 			events.zoomend = this._endZoomAnim;
 		}
@@ -464,15 +465,13 @@ L.GridLayer = L.Layer.extend({
 				bounds.max.divideBy(size).ceil().subtract([1, 1])) : null;
 	},
 
-	_animateZoom: function (e) {
-		if (!this._animating) {
-			this._animating = true;
+	_startZoomAnim: function () {
 		this._prepareBgBuffer();
-
 		this._prevTranslate = this._translate;
 		this._prevScale = this._scale;
-		}
+	},
 
+	_animateZoom: function (e) {
 		// avoid stacking transforms by calculating cumulating translate/scale sequence
 		this._translate = this._prevTranslate.multiplyBy(e.scale).add(e.origin.multiplyBy(1 - e.scale)).add(e.delta);
 		this._scale = this._prevScale * e.scale;
@@ -481,16 +480,9 @@ L.GridLayer = L.Layer.extend({
 	},
 
 	_endZoomAnim: function () {
-		var front = this._tileContainer,
-		    bg = this._bgBuffer;
-
+		var front = this._tileContainer;
 		front.style.visibility = '';
 		L.DomUtil.toFront(front); // bring to front
-
-		// force reflow
-		L.Util.falseFn(bg.offsetWidth);
-
-		this._animating = false;
 	},
 
 	_clearBgBuffer: function () {

src/map/anim/Map.ZoomAnimation.js

@@ -55,20 +55,18 @@ L.Map.include(!zoomAnimated ? {} : {
 
 		this
 		    .fire('movestart')
-		    .fire('zoomstart');
+		    .fire('zoomstart')
+		    .fire('zoomanimstart');
 
+		this._startZoomAnim(center, zoom);
 		this._animateZoom(center, zoom, origin, scale, new L.Point(0, 0));
 
 		return true;
 	},
 
-	_animateZoom: function (center, zoom, origin, scale, delta) {
-
+	_startZoomAnim: function (center, zoom) {
 		this._animatingZoom = true;
 
-		// put transform transition on all layers with leaflet-zoom-animated class
-		L.DomUtil.addClass(this._mapPane, 'leaflet-zoom-anim');
-
 		// remember what center/zoom to set after animation
 		this._animateToCenter = center;
 		this._animateToZoom = zoom;
@@ -78,6 +76,10 @@ L.Map.include(!zoomAnimated ? {} : {
 			L.Draggable._disabled = true;
 		}
 
+		L.DomUtil.addClass(this._mapPane, 'leaflet-zoom-anim');
+	},
+
+	_animateZoom: function (center, zoom, origin, scale, delta) {
 		this.fire('zoomanim', {
 			center: center,
 			zoom: zoom,

src/map/handler/Map.TouchZoom.js

@@ -63,11 +63,10 @@ L.Map.TouchZoom = L.Handler.extend({
 		}
 
 		if (!this._moved) {
-			L.DomUtil.addClass(map._mapPane, 'leaflet-touching');
-
 			map
 			    .fire('movestart')
-			    .fire('zoomstart');
+			    .fire('zoomstart')
+			    .fire('zoomanimstart');
 
 			this._moved = true;
 		}
@@ -111,6 +110,7 @@ L.Map.TouchZoom = L.Handler.extend({
 		    finalScale = map.getZoomScale(finalZoom),
 		    delta = this._delta.add(this._centerOffset.subtract(this._delta).multiplyBy(1 - 1 / this._scale));
 
+		map._startZoomAnim(this._center, finalZoom);
 		map._animateZoom(this._center, finalZoom, this._origin, finalScale, delta);
 	},