`
ahut9923
  • 浏览: 238336 次
  • 性别: Icon_minigender_1
  • 来自: 安徽
社区版块
存档分类
最新评论

Div被Select挡住

 
阅读更多
<html><head>
    <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
    <title>Div下拉菜单被Select挡住的解决办法</title>
</head><body>
<div style="z-index: 10; position: absolute; 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: silver;">
        下拉菜单<br />
        bbbbbbb<br />
        ccccccc<br />
        ccccccc<br />
        ccccccc<br />
        ccccccc
    </div>
</div>
<select style="width: 200">
    <option>test0</option>
    <option>test1</option>
    <option>test2</option>
    <option>test3</option>
</select>
<br />
<pre>
Div被Select挡住，是一个比较常见的问题。
有的朋友通过把div的内容放入iframe或object里来解决。
可惜这样会破坏页面的结构，互动性不大好。
这里采用的方法是：
虽说div直接盖不住select
但是div可以盖iframe，而iframe可以盖select,
所以，把一个iframe来当作div的底，
这个div就可以盖住select了.
</pre>
</body></html>
分享到：
| XP http500的终极解决方法
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    option挡住div解决方法

    Div下拉菜单被Select挡住的解决办法 下拉菜单 bbbbbbb ccccccc ccccccc ccccccc ccccccc test0 test1 test2 test3 Div被Select挡住，是一个比较常见的问题。 有的朋友通过把div的内容放入iframe或object里来...

    解决 Ie 6下 select挡住div的通用函数

    /** * 让iframe 显示在 指定的div下面 针对ie6 select挡住div 的bug 采用 iframe来当作div的底 * * @param string divId 需要解决的div层 * @param string iframeId 采用的 IFRAME ,如果不指定 自动...

    Div Select挡住的解决办法

    在网页设计中，有时会遇到一个常见的问题，即`Div`元素下的下拉菜单（`Select`元素）会被`Div`本身挡住，导致用户无法正常交互。这个问题在标题和描述中提到，我们可以从HTML和CSS的角度来探讨解决方法。 首先，...

    最顶层div被flash或者下拉列表遮挡的问题解决

    ### 最顶层div被flash或者下拉列表遮挡的问题解决 在网页设计中，有时会出现顶层的div元素被其他元素如Flash或下拉列表遮挡的情况。这种遮挡问题通常是由于CSS定位属性设置不当造成的，尤其是`z-index`值的设置不...

    layui layer select 选择被遮挡的解决方法

    在编程的时候, layer弹窗中的select 经常会遇到被遮挡的情况： 解决方法：在页面里面找到对应div的class 给overflow新的属性visible即可(默认值。内容不会被修剪，会呈现在元素框之外。)即可显示出下拉框 1.找到层...

    IE6下 Jquery EasyUI 弹出窗口层无法挡住select 组件 解决方案

    1. **修改CSS**：为弹出窗口的div添加一个更高的z-index值。然而，由于IE6的限制，这可能不足以解决问题。还需要确保select元素的z-index低于dialog。 2. **隐藏select元素**：当弹出窗口显示时，可以使用...

    使用iframe作为日历的载体，不再被select和flash等控件挡住的日期输入框

    ### 使用iframe作为日历的载体，不再被select和flash等控件挡住的日期输入框 在Web开发领域，用户界面的交互性和功能性是至关重要的。本文将深入探讨如何利用iframe（Inline Frame）来承载日历插件，解决常见的UI...

    解决layer弹层遮罩挡住窗体的问题

    通过上述代码，遮罩层的DOM元素会被移动到弹层DOM元素的父级，使得两者处于同一层级，从而解决了遮罩层遮挡弹窗的问题。 总结： 解决layer弹层遮罩挡住窗体问题的关键在于理解DOM元素的层级关系。通过调整遮罩层的...

    jquery插件模糊查询的文本框

    jquery的一个插件 文本框的糊查询，支持本地数据源和ajax异步数据请求 支持文本框的状态，如果不是手工输入，而是通过选择到文本框的值，将可取到...解决IE下div不能挡住select object flash等的标签的显示优先级问题

    Dreamwear设计常用代码 46-52.docx

    6. **解决select挡住div问题**： 当`&lt;select&gt;`元素覆盖了其他内容时，可以使用一个透明的`&lt;iframe&gt;`作为遮罩层来解决。例如： ```html &lt;div&gt; style="z-index:-1;position:absolute;top:5px; left:2px;width:...

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

    在这个例子中，`&lt;div id="PAL2"&gt;`的z-index设为8，而DropdownList（即`&lt;select&gt;`）的z-index设为7，这样DropdownList就会被&lt;div&gt;覆盖，从而解决了遮挡问题。 总之，理解有窗口元素和无窗口元素的概念，以及它们与z-...

    js非常好用的代码,不要错过!

    - 可以在div内部插入一个透明的iframe，通过设置其样式（如 `z-index:-1`，`position:absolute` 等），使其位于select元素之上，从而防止select下拉菜单挡住div内容。 8. iframe自适应高度（跨域问题）： - 当...

    layui: layer.open加载窗体时出现遮罩层的解决方法

    在前端开发中，Layui 是一款非常流行的轻量级组件库，它提供了丰富的界面元素和交互功能。其中，`layer.open` 是 Layui 提供的一个用于弹出对话框的方法，它可以创建各种类型的窗口，如信息提示、页面层、iframe 层...

    jquery插件ajax方式实现百度谷歌文本框糊模查询

    jquery插件ajax方式实现百度谷歌文本框糊模查询 文本框的糊查询，支持本地数据源和ajax异步数据请求 支持文本框的状态，如果不是手工输入，而是通过选择...DIV在IE下不能挡住select object flash等标签的显示优先级问题

Magicbox
Global site tag (gtag.js) - Google Analytics