解决控件遮挡问题:关于有窗口元素和无窗口元素


Posted in PHP onJanuary 28, 2007

不知道朋友们有没有碰到过控件的遮挡问题,最典型的就是DropdownList和ActiveX的遮挡,HTML的z-index就是用于处理这个问题,但是直接设置这个属性还不行,因为这中间还牵扯到有窗口元素和无窗口元素的问题。

有窗口元素大概有以下几种: 
<object> 、ActiveX控件 、Plug-ins、DHTML Scriptlets、SELECT elements(即DropdownList的HTML表现)、IE5.01以前的IFRAMEs 

无窗口元素包括: 
无窗口的ActiveX控件、IE5.5以后的IFRAMEs、大部分的DHTML元素 

其中很值得一提的就是ActiveX控件,默认情况下,VB和MFC的控件是有窗口的,ATL控件是无窗口的,但是ActiveX控件是作为无窗口来进行实现而且实际上被归类到无窗口元素中。 

不管容器怎么设定,所有的有窗口元素都会出现在无窗口的元素之上,有窗口元素和无窗口元素内部自身互相会遵循z-index属性,它们会被绘制在不同的平面上进行显示,设置z-index只能对它们所在的平面起作用,而且有窗口元素的平面始终处于无窗口元素平面之上。 

那么解决遮挡问题的思路就很简单了,把我们的元素封装进一个DIV中,代码示例如下: 

<DIV id="PAL2" style="DISPLAY: inline; Z-INDEX: 8; LEFT: 80px; WIDTH: 360px; POSITION: absolute; TOP: 80px; HEIGHT: 168px"> 
<OBJECT id="dhtmltest" style="Z-INDEX: 8; WIDTH: 352px; HEIGHT: 168px" type="text/x-scriptlet" data="TestDivDropdownList.htm" VIEWASTEXT> 
</OBJECT></DIV> 

DIV的z-index为8,然后将SELECT的z-index调为7即可(只需要比DIV的z-index小)。

PHP 相关文章推荐
Ajax+PHP 边学边练 之二 实例
Nov 24 PHP
php学习笔记(三)操作符与控制结构
Aug 06 PHP
php中将时间差转换为字符串提示的实现代码
Aug 08 PHP
php获取从百度搜索进入网站的关键词的详细代码
Jan 08 PHP
WordPress中设置Post Type自定义文章类型的实例教程
May 10 PHP
php处理json格式数据经典案例总结
May 19 PHP
PHP magento后台无法登录问题解决方法
Nov 24 PHP
php封装的pdo数据库操作工具类与用法示例
May 08 PHP
PHP使用CURL实现下载文件功能示例
Jun 03 PHP
PHP PDO和消息队列的个人理解与应用实例分析
Nov 25 PHP
laravel框架中表单请求类型和CSRF防护实例分析
Nov 23 PHP
tp5.1框架数据库子查询操作实例分析
May 26 PHP
获得Google PR值的PHP代码
Jan 28 #PHP
一键删除顽固的空文件夹 软件下载
Jan 26 #PHP
php中通过smtp发邮件的类,测试通过
Jan 22 #PHP
php5.2.0内存管理改进
Jan 22 #PHP
php中截取字符串支持utf-8
Jan 18 #PHP
php中的登陆login
Jan 18 #PHP
php中的时间显示
Jan 18 #PHP
You might like
PHP安全性漫谈
2012/06/28 PHP
ThinkPHP 整合Bootstrap Ajax分页样式
2016/12/23 PHP
js每次Title显示不同的名言
2008/09/25 Javascript
extjs中grid中嵌入动态combobox的应用
2011/01/01 Javascript
jquery清空表单数据示例分享
2014/02/13 Javascript
$(document).ready(function() {})不执行初始化脚本
2014/06/19 Javascript
使用jQuery实现更改默认alert框体
2015/04/13 Javascript
JavaScript让网页出现渐隐渐显背景颜色的方法
2015/04/21 Javascript
jQuery+ajax实现无刷新级联菜单示例
2015/05/21 Javascript
Javascript随机标签云代码实例
2016/06/21 Javascript
微信小程序 地图定位简单实例
2016/10/14 Javascript
etmvc+jQuery EasyUI+combobox多值操作实现角色授权实例
2016/11/09 Javascript
jquery uploadify如何取消已上传成功文件
2017/02/08 Javascript
vue组件间通信解析
2017/03/01 Javascript
BootStrap注意事项小结(五)表单
2017/03/10 Javascript
jQuery实现的下雪动画效果示例【附源码下载】
2018/02/02 jQuery
JS实现字符串去重及数组去重的方法示例
2018/04/21 Javascript
基于vue循环列表时点击跳转页面的方法
2018/08/31 Javascript
vue-cli 构建骨架屏的方法示例
2018/11/08 Javascript
js比较两个单独的数组或对象是否相等的实例代码
2019/04/28 Javascript
vue-cli history模式实现tomcat部署报404的解决方式
2019/09/06 Javascript
js blob类型url的视频下载问题的解决
2019/11/29 Javascript
vue中音频wavesurfer.js的使用方法
2020/02/20 Vue.js
Vue实现移动端拖拽交换位置
2020/07/29 Javascript
ant design中upload组件上传大文件,显示进度条进度的实例
2020/10/29 Javascript
Python的Flask框架中的Jinja2模板引擎学习教程
2016/06/30 Python
解决Python下imread,imwrite不支持中文的问题
2018/12/05 Python
Django 响应数据response的返回源码详解
2019/08/06 Python
TensorFlow实现模型断点训练,checkpoint模型载入方式
2020/05/26 Python
解决Ubuntu18中的pycharm不能调用tensorflow-gpu的问题
2020/09/17 Python
html5 worker 实例(二) 图片变换效果
2013/06/24 HTML / CSS
德国狗狗用品在线商店:Schecker
2017/03/17 全球购物
英国网上超市:Ocado
2020/03/05 全球购物
linux比较文件内容的命令是什么
2013/03/04 面试题
美容院合作经营协议书
2014/10/10 职场文书
win10滚动条自动往上跑怎么办?win10滚动条自动往上跑的解决方法
2022/08/05 数码科技