Home >Web Front-end >HTML Tutorial >JQuery mask layer_html/css_WEB-ITnose

JQuery mask layer_html/css_WEB-ITnose

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOriginal
2016-06-24 12:03:571458browse

1. The style is set as follows:

<style type="text/css">    .mask {              position: absolute; top: 0px; filter: alpha(opacity=60); background-color: #777;            z-index: 1002; left: 0px;            opacity:0.5; -moz-opacity:0.5;        }</style>

Where: opacity:0.5; is suitable for IE, -moz-opacit :0.5; Applicable to Firefox; you only need to add them, and you can use them in both Firefox and IE.

2. Specify the height and width of the layer.

<script type="text/javascript">    //兼容火狐、IE8    function showMask(){        $("#mask").css("height",$(document).height());        $("#mask").css("width",$(document).width());        $("#mask").show();    }</script>

3. Add the following code to 6c04bd5ca3fcae76e30b72ad730ca86d, and then you can see the effect:

<div id="mask" class="mask"></div><a href="javascript:;" onclick="showMask()" >点我显示遮罩层</a><br />

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn