可見上邊的樣式可實現半透明的遮罩層,我們只需將一個div標簽放置在我們的body中,如下: 在需要遮罩的時候,我們只需將mask變成可見的即可: ...
#mask
{
background-color: rgb(0, 0, 0);
display:none;
opacity: 0.0; /* Safari, Opera */
-moz-opacity:0.0; /* FireFox */
filter: alpha(opacity=0); /* IE */
z-index: 100;
height: 100%;
width: 100%;
background-repeat:repeat;
position:fixed;
top: 0px;
left: 0px;
}
可見上邊的樣式可實現半透明的遮罩層,我們只需將一個div標簽放置在我們的body中,如下:
<div id="mask" class="mask"></div>
在需要遮罩的時候,我們只需將mask變成可見的即可:
$("#mask").show();
最後,我們將要顯示的內容居中顯示在我們的遮罩層之上就可以達到我們想要的效果了,位置通過z-index來控制。在遮罩層上的顯示內容一般需要居中顯示,如果你對css居中還不熟悉,請查水費。