javascript创建页面蒙板的一些知识技巧总结

更新时间：2007年08月19日 12:12:45 作者：

(4)设置了background且设置蒙板全透明(0%)的div蒙板。{背后元素可见但不可操作}

(5)使用div生成的蒙板不能遮盖select，但能遮盖iframe

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"  xml:lang="zh-CN" lang="zh-CN">     <head>     <title></title>     <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> </head> <body> <input type="button" onclick="pop()" value="弹出遮罩层" /> <input type="text"  value="输入框" /> cccccccccccccccc <p>aaaaaaaaaaaa</p> <p>bbbbbbbbbbbbbbbb</p> <select id=""> <option>xxxxxxxxxxxxxx</option> </select> <iframe id="" src="http://www.baidu.com" width="100%" height="300"></iframe> <script type="text/javascript">  </script> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

(6)使用全透明的iframe生成蒙板。{可遮盖select：自动隐藏select}

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

(7)div+iframe遮盖局部select。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"  xml:lang="zh-CN" lang="zh-CN">     <head>     <title></title>     <meta http-equiv="Content-Type" content="text/html; charset=gb2312" />     <style type="text/css">         *{margin:0px;padding:0px}     </style> </head> <body> <input type="text" id="inbox" style="height:20px;width:140px;line-height:20px;position:absolute;top:50px;left:50px" value="点击我遮盖下面的输入框" onclick="pop()" onblur="undoPop()" /> <select id="" style="position:absolute;top:80px;left:50px"><option>aaaaaaaaaaaaaaaaaaaaaaaaaaaaa</option></select> <script type="text/javascript">  </script> </body> </html>

[Ctrl+A 全选注:引入外部Js需再刷新一下页面才能执行]

您可能感兴趣的文章:

javascript创建页面蒙板的一些知识技巧总结

JS中向对象中添加对象的3种方法
这篇文章主要给大家介绍了关于JS中向对象中添加对象的3种方法,在JavaScript中对象可以通过两种方法添加对象,文中通过示例代码介绍的非常详细,需要的朋友可以参考下
2023-07-07
超酷的网页音乐播放器DewPlayer使用方法
在网上闲逛的时候无意中看到 Dewplayer 播放器，感觉不错，特此分享。
2010-12-12
Js实现手机发送验证码时按钮延迟操作
在做项目的时候，经常遇到发短信验证码的问题，这时候需要用户点完发送验证码按钮后，一段时间内不能重复点击，毕竟验证码都是收费的嘛，谁都不想浪费，那么如何实现这种功能呢？下面来分享一下。
2014-06-06
Bootstrap carousel轮转图的使用实例详解
图片轮播效果在Web中常常能看到，很多人也称之为幻灯片。这篇文章主要给大家介绍Bootstrap carousel轮转图的使用实例详解，需要的朋友可以参考下
2016-05-05
JavaScript动态创建div等元素实例讲解
这篇文章主要介绍了JavaScript动态创建div等元素实例，
2016-01-01
js+canvas实现飞机大战
这篇文章主要为大家详细介绍了js canvas实现飞机大战，文中示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下
2022-05-05
ES6中Proxy与Reflect实现重载(overload)的方法
这篇文章主要介绍了ES6中Proxy与Reflect实现重载(overload)的方法,分析了重载的原理及使用Proxy和Reflect来实现重载的操作步骤与相关技巧,需要的朋友可以参考下
2017-03-03
JavaScript仿京东实现秒杀倒计时案例详解
这篇文章主要为大家详细介绍了如何利用JavaScript实现京东秒杀倒计时效果，文中示例代码介绍的非常详细，感兴趣的小伙伴们可以参考一下
2022-03-03
uniapp上传本地图片以及以二进制流的方式上传
这篇文章主要给大家介绍了关于uniapp上传本地图片以及以二进制流的方式上传的相关资料,最近在自己写一个uniapp的项目,刚好遇到了上传图片到服务器的功能,这里总结一下,需要的朋友可以参考下
2023-07-07
javascript中String对象的slice()方法分析
这篇文章主要介绍了javascript中String对象的slice()方法,以实例形式分析了slice()方法的定义、参数与具体用法,具有一定的参考借鉴价值,需要的朋友可以参考下
2014-12-12

javascript创建页面蒙板的一些知识技巧总结

相关文章

最新评论

大家感兴趣的内容

最近更新的内容

常用在线小工具