在提交页面后仅显示带有透明背景的加载图像

Question

我想在页面提交后显示加载图像。 我希望它像一样，加载显示在页面中间的图像，并且它应该具有透明的背景来显示页面内容。 我已经使用以下

    #loading {
    position:fixed;
    top:50%;
    left:50%;
    z-index:1104;
    background-color:#999999;
    width:100%;
    height:100%;

    }

请不要在答案中包含javascript部分，我只想了解样式。

这不会给整个页面提供背景色。 请帮助我如何在页面中心显示加载图像，页面内容应略显。

谢谢

Answer 1

移除顶部：50％，左侧：50％；

http://jsfiddle.net/qqncv/1/

Answer 2

假设您要禁用所有与正在加载的内容的交互，则可以简单地覆盖元素并将其背景居中：

#overlay { 
    /*Cover the entire screen regardless of scrolling*/ 
    position:fixed;top:0;right:0;bottom:0;left:0; 
    background: #ff0000 url(...) no-repeat 50% 50%; 
}

摆弄半透明的bgcolor进行演示。

编辑：实际上将元素垂直和水平居中都很难 。