Home > Web Front-end > JS Tutorial > body text

javascript创建页面蒙板的一些知识技巧总结第1/3页_javascript技巧

PHP中文网
Release: 2016-05-16 19:09:55
Original
885 people have browsed it

在ajax大行其道的今天,模拟弹出窗口,或者thinkbox,greybox等很多特效都用了蒙板的功能,其应用原来对于我们来说也很简单:创建一个绝对定位,top/left都为0,宽度和高度等于浏览器内容的高宽,然后索引设置的大点即可。可是这里有一些问题和技巧可能是您一直都不知道或者不清楚的,这里总结几点,这些都是个人学习的过程中发现的。


1、创建的蒙板如果要禁止对蒙板下部内容的操作必须设置background属性且必须设置一个有效的值,否则虽然遮罩层创建成功,但仍然可以对页面下部的元素进行操作。

2、如果要显示页面底部的元素可以通过css设置透明度来实现,如filter:alpha(opacity=0),这里是完全透明,淡然也可以设置为半透明。

3、p层形成的蒙板可以蒙住iframe,但不能盖住select及object。

4、可以使用iframe可以遮盖select,一般使用iframe和p结合的办法遮盖select(p所以要比iframe的z索引高)并创建内容,其实iframe会自动隐藏select,也可以自己只使用p和js隐藏select。

5、对于使用js隐藏select的方法多数是在创建真正的蒙板时使用,如弹出框或thinkbox等。对于使用iframe和p的办法主要用于局部蒙板,如日期控件或title弹出时使用iframe和p定位在同一位置可以遮盖住其下的select控件。


以下为上面一些总结的演示:
(1)不设置background属性的p蒙板。{蒙板出现后背后元素依然可以操作}

source:php.cn
Statement of this Website
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
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template