/**
* 通过使用Ifram,解决div层挡不住Select组件的问题(通常该问出出现IE6浏览器中)
* (如果需要源代码请下载附件)
*
* @Author JiangShui
* @Date 2010-10-18
*/
1、依赖组件:依赖于Jquery的核心组件jquery.js。
2、解决的问题:解决div层挡不住Select组件的问题(通常该问出出现IE6浏览器中)。
3、使用方法:①、在要使用的页面(.jsp或者.html)中首先导入Jquery的核心组件库jquery.js。(如果不使用Jquery
组件,你必须修改js文件中的部分代码:
1、获取浏览器类型和版本号的代码$.browser.msie && $.browser.version=='6.0'
2、在指定id的容器中追加html代码:$("#"+parentDivId).append(iframeHtml);
3、从html文档中移除指定id的html组件:$("#iframeDivUsedForCoverSelect").remove();
如果你对html的文档模型比较熟悉,修改以上代码应该不是很困难)。
②、导入该js文件中的两个方法。
注意:1、在层弹出之前调用方法:openIframeDiv(parentDivId);(parentDivId为select组件所在的容器div的id)
2、在关闭弹出的层之后调用方法:removeIframe();
/**
* 通过使用Ifram,解决div层挡不住Select组件的问题(通常该问出出现IE6浏览器中)
*
* @Author JiangShui
*
* @Date 2010-10-19
*/
/**
* 如果当前的浏览器是IE6,则打开一个iframe层,用于遮挡select组件,
* 本组件用于解决IE6中,div层挡不住select组件的bug
*
* @param parentDivId iframe所依赖的父窗口div层的id,要遮挡的select组件
* 便在该div中(如果select组件不在一个div中,请放入一个div中
* 并定义一个id作为该参数的值)
*
*/
function openIframeDiv(parentDivId) {
if($.browser.msie && $.browser.version=='6.0'){
var iframeHtml = '<iframe id="iframeDivUsedForCoverSelect" scrolling="auto" width="100%" height="100%" '
+ 'frameborder="0" framespacing="0" style="filter:alpha(opacity:0);'
+ 'opacity:0;left:0px;top:0px;position:absolute;z-index:1;"></iframe>';
$("#"+parentDivId).append(iframeHtml);
}
}
/**
* 移除iframe层,与方法openIframeDiv(parentDivId)配对使用
*
*
*/
function removeIframe() {
//获取以前的查询窗口对象
var searchObj = document.getElementById("iframeDivUsedForCoverSelect");
//如果对应id的组件已经存在则将其删除
if (null != searchObj && typeof(searchObj) != "undefined") {
$("#iframeDivUsedForCoverSelect").remove();
}
}
分享到:
相关推荐
解决IE6 中select 穿透 div 等层的问题
ie6下DIV覆盖select框js解决代码
/** * 让iframe 显示在 指定的div下面 针对ie6 select挡住div 的bug 采用 iframe来当作div的底 * * @param string divId 需要解决的div层 * @param string iframeId 采用的 IFRAME ,如果不指定 自动...
这个应该在网上有很多解决的办法,只不过很多问题解决了之后就忘了,之后遇到了再去找有时就找不到了,就当给自己做个笔记了 方法很简单在层里套个iframe <div>能看见我了吗?<iframe frameborder="0" ></...
用DIV模仿SELECT下拉框 function replaceSelects() { try{ for (i=0;i;i++){ // 隐藏 select selects[i].style.display = 'none'; select_divTag = document.createElement('div'); select_divTag.id = ...
用div+jq高仿ie6的select表单随内容增加 进行了一个升级,将其做成一个类似插件的形式; 在html中,依旧是应用传统的select进行布局,只需要给select一个class为toDiv,就可以动态的将select替换为已经设置好了的div...
ie6下select覆盖div的解决办法
div错位解决IE6、IE7、IE8样式不兼容问题IE6里DIV错位的问题.doc
select 在ie6下覆盖div bug 解决方案。 div 模拟select 单选 在 body onload事件中调用init_select方法就可,参数传相关背景图片就可。我都已经放到资源包下了。
使用div+css,实现select美化效果,兼容谷歌,火狐,IE6以上浏览器等。
div错位解决IE6IE7IE8样式不兼容问题
select ——使用DIV 实现 Select js源码
IE6等div 100%高度填满解决办法
DIV+select美化支持IE6 IE7 火狐(门户搜索)觉得兼容 多多支持啊。 偶整理出来滴。共享下。偶米多少积分了。搞点分啊。支持下。。
JS+DIV以层代替弹出窗口的例子,弹出DIV层窗口 JS+DIV以层代替弹出窗口的例子,弹出DIV层窗口 JS+DIV以层代替弹出窗口的例子,弹出DIV层窗口 JS+DIV以层代替弹出窗口的例子,弹出DIV层窗口 JS+DIV以层代替弹出窗口的例子...
利用Jquery解决IE6下,Select的Z-index过高的BUG 经常有朋友下拉菜单被Select遮盖。可以用此方法解决!
由于select是window控件,它会遮挡被定位的元素,可以使用该jquery插件解决问题.这里有详细的举例说明.
NULL 博文链接:https://wing123.iteye.com/blog/964102