Css mask code (verified) and css mask code verification

Css mask code (verified) and css mask code verification

# 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 ;}

We can see that the above style implements a translucent mask layer. We only need to place a div label in our body, as shown below:

<Div id = "mask" class = "mask"> </div>

When you need a mask, you only need to make the mask visible:

$ ("# Mask"). show ();

Finally, the content we want to display is centered on the top of our mask layer to achieve the desired effect. The position is controlled by z-index. The display content on the mask layer usually needs to be centered. If you are not familiar with css center, please check the water fee.