diff --git a/src/layer/tile/GridLayer.js b/src/layer/tile/GridLayer.js
index 445baf40..3ce8f56b 100644
--- a/src/layer/tile/GridLayer.js
+++ b/src/layer/tile/GridLayer.js
@@ -322,7 +322,11 @@ export var GridLayer = Layer.extend({
 			if (fade < 1) {
 				nextFrame = true;
 			} else {
-				if (tile.active) { willPrune = true; }
+				if (tile.active) {
+					willPrune = true;
+				} else {
+					this._onOpaqueTile(tile);
+				}
 				tile.active = true;
 			}
 		}
@@ -335,6 +339,8 @@ export var GridLayer = Layer.extend({
 		}
 	},
 
+	_onOpaqueTile: Util.falseFn,
+
 	_initContainer: function () {
 		if (this._container) { return; }
 
@@ -358,9 +364,11 @@ export var GridLayer = Layer.extend({
 		for (var z in this._levels) {
 			if (this._levels[z].el.children.length || z === zoom) {
 				this._levels[z].el.style.zIndex = maxZoom - Math.abs(zoom - z);
+				this._onUpdateLevel(z);
 			} else {
 				DomUtil.remove(this._levels[z].el);
 				this._removeTilesAtZoom(z);
+				this._onRemoveLevel(z);
 				delete this._levels[z];
 			}
 		}
@@ -381,6 +389,8 @@ export var GridLayer = Layer.extend({
 
 			// force the browser to consider the newly added element for transition
 			Util.falseFn(level.el.offsetWidth);
+
+			this._onCreateLevel(level);
 		}
 
 		this._level = level;
@@ -388,6 +398,12 @@ export var GridLayer = Layer.extend({
 		return level;
 	},
 
+	_onUpdateLevel: Util.falseFn,
+
+	_onRemoveLevel: Util.falseFn,
+
+	_onCreateLevel: Util.falseFn,
+
 	_pruneTiles: function () {
 		if (!this._map) {
 			return;
@@ -442,6 +458,7 @@ export var GridLayer = Layer.extend({
 	_invalidateAll: function () {
 		for (var z in this._levels) {
 			DomUtil.remove(this._levels[z].el);
+			this._onRemoveLevel(z);
 			delete this._levels[z];
 		}
 		this._removeAllTiles();