IE7中的Textarea在鼠标上消失
-
02-07-2019 - |
题
我有这个大数据输入类页面,一种使用div的表格布局。每行都有可以切换打开/关闭的子行。使用css可见性设置触发切换。每个“细胞”都是一个细胞。表格中有一个小图像,你点击图像,然后会打开一个弹出窗口,允许你在条目上添加注释。
此弹出窗口有一个文本区域和一组复选框,以及一个按钮(输入类型=提交,我认为)。弹出窗口是嵌套在隐藏div中的iframe。
在IE7中,一旦你弹出这个音符iframe并向下滚动页面,将鼠标悬停在弹出窗口的textarea上会使其消失并显示其下方的页面内容。鼠标悬停时,复选框也会显示下面的页面。
所以,我尝试了一些不同的修复方法。 Z-index是我希望可以用来解决这个问题的方法。没有这样的运气。我可能会尝试使用普通输入类型=文本替换文本区域,但由于复选框也显示此错误,我怀疑单行文本输入也会导致错误。
解决方案
除了块元素之外,z-index适用于IE调用的所有元素hasLayout 阅读更多内容
其他提示
触发 hasLayout
(在另一篇文章中提到)的最简单方法是添加 zoom:1
。
在调试一些最愚蠢的IE 6/7显示问题时,我有时会抛出一个临时的
* {
zoom: 1;
}
到我的CSS,看看是否有任何变化。如果是的话,我开始有选择地将它添加到以元素开头的元素,元素的父/子等
zoom
仅受IE支持,所以它非常“安全”。在你的文件中。它还可以让您免于必须做任何疯狂的事情,如绝对定位元素等。
如果我记得正确的Z-Index只对绝对定位的块元素有效。因此,尝试将弹出框的位置设置为绝对,然后尝试z-index。如果需要弹出窗口位于某个位置,请将包装元素设置为相对位置。我之前遇到过这个问题,我相信我是按照我所描述的方式解决的。
我在IE7中输入字段和textareas都有完全相同的问题,但前提是我给了它们一个宽度。
我不记得从哪里得到它,但我找到了这个解决方案,它可能不是很优雅,但它解决了这个问题。只需添加:
filter:alpha(opacity=100)
到你麻烦的领域的样式属性的css。