`
- 浏览:
783046 次
- 性别:
- 来自:
上海
-
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
</head>
<body>
<div style="z-index:10;position:absolute;top:0px;width:100;height:18;overflow:hidden;" onmouseover="this.style.height=100;" onmouseout="this.style.height=18;">
<iframe style="position:absolute;z-index:-1;width:100%;height:100%;top:0;left:0;scrolling:no;" frameborder="0" src="about:blank">
</iframe>
<div style="background-color:#cccccc;">aaaaaaa<br>bbbbbbb<br>ccccccc<br>ccccccc<br>ccccccc<br>ccccccc</div>
</div>
<select style="width:200" ><option>test0<option>test1<option>test2<option>test3</select>
<br>
<pre>源码网：www.codepub.com
Div被Select挡住，是一个比较常见的问题。
有的朋友通过把div的内容放入iframe或object里来解决。
可惜这样会破坏页面的结构，互动性不大好。
这里采用的方法是：
虽说div直接盖不住select
但是div可以盖iframe，而iframe可以盖select,
所以，把一个iframe来当作div的底，
这个div就可以盖住select了.
</pre>
</body>
</html>
分享到：
相关推荐
本文将探讨如何实现"让div浮动在select之上的完美解决方案"，并确保在多个浏览器中具有良好的兼容性。 首先，我们需要理解`z-index`属性在CSS中的作用。`z-index`决定了元素在堆叠上下文中的层级，数值越大，元素越...
这个问题在现代浏览器中通常不会出现，但在IE6中，`<select>`下拉菜单会出现在任何其他浮动元素或绝对定位元素之上，即使这些元素在HTML结构中位于`<select>`前面。这导致了设计上的困扰，因为开发者可能希望某些...
在这个“HTML5+CSS3自定义浮动Select超炫下拉菜单动画源码”中，我们将深入探讨如何利用这些技术实现一个创新的下拉菜单。 首先，HTML5中的`<select>`元素通常用于创建选择列表，但其样式控制有限。为了打破这个...
标题“ie6下select遮挡div”指出的是一个典型的IE6特有的问题：当在网页上使用select下拉框时，它会覆盖在其他使用绝对或相对定位的元素（如div）之上，导致这些元素无法正常显示。这个问题对于设计美观且交互性强的...
在网页设计中，`div+css`是一种常见的布局方式，用于构建页面结构和样式，而`select`控件则是HTML中的一个基础元素，通常用于创建下拉列表供用户选择。本项目通过`jq`（jQuery）库实现了对`select`控件的模仿，创建...
这个问题主要体现在`select`元素总是会出现在`div`之上，无论`div`的`z-index`设置得多高。这在网页设计中是一个常见的兼容性问题，尤其是在尝试创建弹出窗口或浮动元素时。本文将详细介绍如何通过JavaScript来解决...
本篇文章将详细讲述如何使用jQuery实现一个浮动层（Div）在浏览器中居中显示的效果。 首先，我们需要在HTML页面的`<head>`部分引入jQuery库。在文档中，我们通过`<script>`标签引入了jQuery的压缩版本（`jquery-...
总之，通过CSS和Div，我们可以有效地控制SELECT元素的样式，提高其在各种浏览器上的视觉一致性。需要注意的是，由于浏览器的兼容性问题，有时可能需要使用特定的hack或条件注释来确保在所有环境下都能正确显示。在这...
在某些情况下，当一个HTML页面中的select元素被点击时，其下拉选项可能会穿透并显示在覆盖在其上方的其他DOM元素（如一个浮动的DIV）之下，导致视觉上的不正常。这个问题主要出现在IE6至IE9等旧版本的浏览器中。 ...
本文将深入探讨如何利用jQuery解决一个特定的问题：在IE6下，Select元素总是显示在具有较高z-index的图层（如div）之上。 首先，我们要理解z-index的概念。在CSS中，z-index是一个用于控制元素在垂直方向（即Z轴）...
2. 在待选区的`div`中，用`<select>`元素创建一个多选下拉列表，通过`<option>`标签添加各项。 3. 使用JavaScript或jQuery监听`select`元素的`change`事件，当用户做出选择时，将选定的`option`移动到已选区的`div`...
2. 使用脚本找到 Select 标签在网页上的绝对位置，并在该位置上用 DIV 标签创建一个假的 Select 标签。 3. 读取 Select 标签中的值，并将其应用到假的 Select 标签中。 4. 当用户点击假的 Select 标签时，浮动出一个...
这样，`clearfix`伪元素会在容器内部创建一个新的块格式化上下文，有效地清除了浮动的影响，保持了容器的高度。 总结一下，要实现两个`div`并排显示，可以通过以下步骤： 1. 使用`float:left`使`div`元素浮动并靠左...
如：我想要<div id="ok">这里是弹出浮动遮罩层</div> 并随页面滚动而滚动 只要调用 $('#ok').showModel();这个方法就可以了 调用$('#ok').closeModel();就可以关闭层了 这个插件还有个好处是自动隐藏select控件，...
但在IE6中，select元素具有一个特殊的默认z-index，即使其值较低，它仍然会浮在其他元素之上，特别是浮动或绝对定位的元素，如EasyUI的dialog。 解决这个问题的方法有几种： 1. **修改CSS**：为弹出窗口的div添加...
- 响应式设计：使用标签设置视口，以便在不同设备上适配页面。 - 表单处理：创建表单元素如、<select>、，并学习如何处理用户输入。 2. CSS（层叠样式表）： CSS用于控制HTML元素的外观、布局和排版。掌握CSS的...
`.div-select-text`是显示当前选中项的部分，设置为左浮动，背景颜色为白色，并且通过`overflow: hidden`来处理文本溢出的情况。`.div-select-arrow`用于显示箭头，它浮于右侧，包含一个内部`div`来呈现箭头图形。`....
2. `#uboxstyle .select_box`：这个类定义了包含`select`元素的外层`div`样式，同样设置了宽高和浮动属性。 3. `.tag_select`, `.tag_select_hover`, `.tag_select_open`：这三个类分别对应下拉菜单在正常状态、...
这在网页交互设计中非常实用，能够帮助用户更好地操作页面上的浮动窗口或者菜单等组件。 #### 二、核心功能点 ##### 1. 初始化设置 - **menuPoint**：存储与移动相关的坐标和尺寸信息。 - `prox`: 指向元素的起始...