Question

我想调暗页面并显示加载指示器。我得到了jQuery集。这是我无法工作的CSS。这是我不能做的背景。有什么想法吗？

这就是我得到的（在页面中央显示指标）：

#Loading
{
    display: none;
    position: fixed;
    z-index: 1000;
    height: 31px;
    width: 60px;
    left: 50%;
    top: 35%;
    background-image: url('../Images/ajax-loader-bright.gif');
    background-repeat: no-repeat;
}

Answer 1

因为您已将问题标记为CSS 3：

background: rgba(0,0,0,.5) url('../Images/ajax-loader-bright.gif') no-repeat;
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:999;

您可以通过更改包含.5的行中的字母（rgba）来调整调光级别。

Answer 2

使用带有/不带图像的jquery创建昏暗页面也可以使用此插件完成 http://jquery.malsup.com/block/#demos

生成ajax加载页面，http://www.ajaxload.info/非常棒。

Answer 3

您可以使用一个单独的div，其宽度和高度设置为100％。然后将此div的背景设置为＃000（黑色），将其不透明度设置为50％（或任何你想要的暗淡程度）。

<div id='dim_wrapper' style='width:100%; height:100%; background:#000; z-index:10'>&nbsp;</div>
<script>
$("#dim_wrapper").animate({
    'opacity':0.5
});
</script>

调暗页面并显示加载指示

3 个答案: