如何在带有滚动条的屏幕中心显示load.gif [英] How to display loading.gif at the center of the screen which has a scrollbar

问题描述

我试图在用户点击按钮时显示loaded.gif / spin wheel。
我在母版页中添加了如下div：

I am trying to display loading.gif/spinning wheel whenever a user clicks the button. I have added a div as below in the master page:

<div id="loadingDiv">
    <div>
        <h7>Please wait...</h7>
    </div>
</div>

这是css：

#loadingDiv{
  position:absolute;
  top:0px;
  right:0px;
  width:100%;
  height:100%;
  background-color:#666;
  background-image:url('ajax-loader.gif');
  background-repeat:no-repeat;
  background-position:center;
  z-index:10000000;
  opacity: 0.4;
  filter: alpha(opacity=40); /* For IE8 and earlier */
}

gif显示在页面的中心。但是因为页面真的很长，我必须滚动才能看到load.gif。

When I try this, the loading.gif is displayed at the center of the page. But as the page is really long , I have to scroll in order to see the loading.gif.

如何在屏幕中央显示loading.gif这是可见的？
如果我向下滚动，我会再次在屏幕中心看到。

How can I display the loading.gif at the center of the screen which is visible? And if I scroll down, I should see that again at the center of the screen.

推荐答案

，尝试改变位置：绝对; with position：fixed;

in your CSS, try changing position:absolute; with position:fixed;

这篇关于如何在带有滚动条的屏幕中心显示load.gif的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！