diff --git a/src/base/pane.js b/src/base/pane.js
index 5a5e202dd6..421f312734 100644
--- a/src/base/pane.js
+++ b/src/base/pane.js
@@ -74,22 +74,28 @@ BI.Pane = BI.inherit(BI.Widget, {
                 width: 5
             }]
         });
+        var loadingGif = BI.createWidget({
+            type: "bi.layout",
+            cls: "loading-background",
+            height: 30
+        });
+        var loadingEffect = (BI.isIE() && BI.getIEVersion() < 10) ? loadingGif : loadingAnimation;
         if (o.overlap === true) {
             if (!BI.Layers.has(this.getName())) {
                 BI.createWidget({
-                    type: "bi.center_adapt",
+                    type: "bi.absolute_center_adapt",
                     items: [{
-                        el: loadingAnimation
+                        el: loadingEffect
                     }],
                     element: BI.Layers.make(this.getName(), this)
                 });
             }
             BI.Layers.show(self.getName());
         } else if (BI.isNull(this._loading)) {
-            this._loading = loadingAnimation;
+            this._loading = loadingEffect;
             this._loading.element.css("zIndex", 1);
             BI.createWidget({
-                type: "bi.absolute",
+                type: "bi.absolute_center_adapt",
                 element: this,
                 items: [{
                     el: this._loading,
diff --git a/src/less/base/pane.less b/src/less/base/pane.less
index 1e2246c580..8818dfb876 100644
--- a/src/less/base/pane.less
+++ b/src/less/base/pane.less
@@ -5,15 +5,15 @@
 }
 
 .bi-loading-widget {
-    &>div {
+    div {
         .background-color(@background-color-highlight, 90%);
         .border-radius(2.5px);
         .animation(loading-widget 0.8s infinite linear);
     }
-    & .rect2 {
+    .rect2 {
         .animation-delay(-0.2s);
     }
-    & .rect3 {
+    .rect3 {
         .animation-delay(-0.4s);
     }
     .keyframes (loading-widget, {