diff --git a/lib/OpenLayers/Layer/Grid.js b/lib/OpenLayers/Layer/Grid.js
index 6e69c35f6b..034c72c3f8 100644
--- a/lib/OpenLayers/Layer/Grid.js
+++ b/lib/OpenLayers/Layer/Grid.js
@@ -98,9 +98,14 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
      * Two posible values:
      *
      * "resize" - Existing tiles are resized on zoom to provide a visual
-     * effect of the zoom having taken place immediately.  As the
-     * new tiles become available, they are drawn over top of the
-     * resized tiles (this is the default setting).
+     *     effect of the zoom having taken place immediately.  As the
+     *     new tiles become available, they are drawn over top of the
+     *     resized tiles (this is the default setting).
+     * "map-resize" - Existing tiles are resized on zoom and placed below the
+     *     base layer.  New tiles for the base layer will cover existing tiles.
+     *     This setting is recommended when having an overlay duplicated during
+     *     the transition is undesirable (e.g. street labels or big transparent
+     *     fills). 
      * null - No transition effect.
      *
      * Using "resize" on non-opaque layers can cause undesired visual
@@ -705,8 +710,12 @@ OpenLayers.Layer.Grid = OpenLayers.Class(OpenLayers.Layer.HTTPRequest, {
             backBuffer.id = this.div.id + '_bb';
             backBuffer.className = 'olBackBuffer';
             backBuffer.style.position = 'absolute';
-            backBuffer.style.zIndex = this.map.Z_INDEX_BASE.BaseLayer -
-                    (this.map.getNumLayers() - this.map.getLayerIndex(this));
+            var map = this.map;
+            backBuffer.style.zIndex = this.transitionEffect === 'resize' ?
+                    this.getZIndex() - 1 :
+                    // 'map-resize':
+                    map.Z_INDEX_BASE.BaseLayer -
+                            (map.getNumLayers() - map.getLayerIndex(this));
             for(var i=0, lenI=this.grid.length; i<lenI; i++) {
                 for(var j=0, lenJ=this.grid[i].length; j<lenJ; j++) {
                     var tile = this.grid[i][j],
diff --git a/tests/Layer/Grid.html b/tests/Layer/Grid.html
index 3ec61818f9..439310d419 100644
--- a/tests/Layer/Grid.html
+++ b/tests/Layer/Grid.html
@@ -1049,7 +1049,7 @@
     }
 
     function test_createBackBuffer(t) {
-        t.plan(8);
+        t.plan(9);
 
         var map = new OpenLayers.Map('map');
         var layer = new OpenLayers.Layer.WMS('', '', {}, {
@@ -1074,7 +1074,16 @@
         OpenLayers.Tile.Image.prototype.createBackBuffer = function() {
             return document.createElement('div');
         };
+        
+        layer.transitionEffect = 'map-resize';
         backBuffer = layer.createBackBuffer();
+        t.ok(backBuffer.style.zIndex == 99, 'z-index of backbuffer correct for "map-resize".');
+        layer.removeBackBuffer();
+        
+        layer.transitionEffect = 'resize';
+        backBuffer = layer.createBackBuffer();
+        t.ok(backBuffer.style.zIndex == layer.getZIndex() - 1, 'z-index of backbuffer correct for "resize",');
+
         layer.backBufferResolution = 1;
         layer.gridResolution = 1;
         layer.backBuffer = backBuffer;
@@ -1083,7 +1092,6 @@
         layer.applyBackBuffer(1);
         t.ok(backBuffer != undefined,
              'createBackBuffer returns a back buffer');
-        t.eq(layer.backBuffer.style.zIndex, '99', 'z-index of backbuffer correct.');
         t.eq(backBuffer.childNodes[0].style.left, '0px',
              'first tile has correct left');
         t.eq(backBuffer.childNodes[0].style.top, '0px',