`

js解决IE遮罩层无法遮罩select

 
阅读更多

1、包含js

 

(function(a){a.fn.bgiframe=(a.browser.msie&&/msie 6\.0/i.test(navigator.userAgent)?function(d){d=a.extend({top:"auto",left:"auto",width:"auto",height:"auto",opacity:true,src:"javascript:false;"},d);var c='<iframe class="bgiframe"frameborder="0"tabindex="-1"src="'+d.src+'"style="display:block;position:absolute;z-index:-1;'+(d.opacity!==false?"filter:Alpha(Opacity='0');":"")+"top:"+(d.top=="auto"?"expression(((parseInt(this.parentNode.currentStyle.borderTopWidth)||0)*-1)+'px')":b(d.top))+";left:"+(d.left=="auto"?"expression(((parseInt(this.parentNode.currentStyle.borderLeftWidth)||0)*-1)+'px')":b(d.left))+";width:"+(d.width=="auto"?"expression(this.parentNode.offsetWidth+'px')":b(d.width))+";height:"+(d.height=="auto"?"expression(this.parentNode.offsetHeight+'px')":b(d.height))+';"/>';return this.each(function(){if(a(this).children("iframe.bgiframe").length===0){this.insertBefore(document.createElement(c),this.firstChild)}})}:function(){return this});a.fn.bgIframe=a.fn.bgiframe;function b(c){return c&&c.constructor===Number?c+"px":c}})(jQuery);

 2、使用 $(".tips").bgiframe();  //解决IE6下,无法遮罩SELECT

  tips是遮罩层div选择节点

分享到:
评论

相关推荐

    poshytip插件在IE6中,被select遮罩问题

    总之,解决PoshyTip在IE6下被`&lt;select&gt;`遮罩的问题需要对IE6的渲染机制有深入的理解,并结合CSS和JavaScript技巧进行调整。尽管现代浏览器已经广泛替代了IE6,但在维护旧项目或支持老用户时,这些问题依然可能出现,...

    jquery 遮罩层

    ### jQuery 遮罩层详解 #### 一、概述 jQuery 是一款优秀的 JavaScript 库,它简化了 HTML 文档遍历、事件处理、动画以及 Ajax 交互等操作。本文主要介绍 jQuery 中的一个实用功能——遮罩层(Mask Layer),特别...

    DIV遮罩层如何实现

    4. 兼容性考虑:示例代码中特别提到了在IE6浏览器中,如果使用DIV元素作为遮罩层,可能会遇到无法遮挡&lt;select&gt;元素的问题,因此选择了使用元素作为遮罩层,以解决该兼容性问题。另外,还特别考虑了页面在无滚动条时...

    在浏览器窗口上添加遮罩层的方法

    此外,为了解决IE6下的另一个问题——遮罩层无法覆盖select元素,我们还需要在遮罩层中添加一个透明的iframe。这个iframe可以覆盖select元素,防止它们在遮罩层下方可见。HTML代码如下: ```html &lt;iframe src="...

    解决DIV在IE下被下拉列表select穿透的问题(一)

    通过该插件,开发者可以创建一个动态的遮罩层或对话框,当select元素被点击时,显示遮罩层,防止select穿透。具体实现方式需参考插件文档和博客文章内容。 4. **升级或替换浏览器**:对于用户端,建议升级到较新的...

    IE6下div层被select控件遮住的问题解决方法

    在互联网的早期,尤其是IE6浏览器占据主导地位的时代,开发者们常常会遇到一个棘手的问题:在页面上,当一个`div`层位于`select`下拉框之上时,`select`控件会穿透`div`层显示出来,导致设计效果无法正常展现。...

    JS打开关闭移动层动画实例

    此段代码专为IE浏览器编写,检测是否存在需要覆盖的`select`元素,并创建或重用`iframe`作为遮罩层。 ##### 3. 获取样式 ```javascript menuOC.prototype.getStyle = function (obj, stylename) { var curVal = "...

    JavaScript实现弹出DIV层同时页面背景渐变成半透亮效果_.docx

    - 在创建背景遮罩层时,使用 CSS 的 `opacity` 属性控制其透明度,初始值设为 0,然后通过 JavaScript 的 `showBackground` 函数逐步增加透明度,实现渐变效果。 - 对于 IE 浏览器,使用滤镜(`filter:alpha...

    百度Popup.js弹出框进化版 拖拽小框架发布 兼容IE6/7/8,Firefox,Chrome

    遮罩层可以在IE6、7、8下全屏,但在Firefox和Chrome下无法全屏遮罩。这是因为遮罩层的样式被设置为height:100%,而在有&lt;!DOCTYPE&gt;声明的页面中,这种方法无法与Firefox和Chrome兼容。通过研究网上流传的“luocheng”...

    Js制作简单弹出层DIV在页面居中 中间显示遮罩的具体方法

    这两天要用到正好练练手,比想象中碰到的问题要多,比如: ie6背景透明 ie6居中显示 还有对js对象的理解 openID=显示按钮,conID=需要显示的div,closeID=关闭按钮 解决了: 1.可以遮挡ie6下的select元素 但是在ie6下div...

    jQuery实现的浮动层div浏览器居中显示效果

    随后,我们定义了两个JavaScript函数,一个用于显示浮动层和遮罩层,另一个用于隐藏这两个层。在`show()`函数中,首先创建了遮罩层的HTML元素,将其添加到页面的`&lt;body&gt;`中,并设置其`display`属性为`block`,然后...

    jQuery插件实现可输入和自动匹配的下拉框

    select2插件的使用需要引入两个CSS和JS文件(select2.css和select2.js),并且需要一定量的JavaScript代码来初始化插件。 第三种推荐的是magicsuggest插件。与select2相比,magicsuggest更加简洁,能够节约js代码。...

    javascript 弹出层组件(升级版)

    1. IE6下,当弹出层出现时,页面中的`select`元素无法被遮挡。为了解决这个问题,开发者建议在自定义的弹出层`div`中添加`iframe`以达到遮罩效果。组件自带的弹出层已经考虑到了这个问题,可以遮挡住`select`元素。 ...

    仿XP关机效果的弹出窗口功能

    - **`function setSelectState(state)`**:该函数用于设置页面中所有`&lt;select&gt;`元素的可见状态,主要是在IE浏览器中避免弹窗遮挡下拉菜单的问题。 - **`function mousePosition(ev)`**:该函数用于获取鼠标点击位置...

    超漂亮的jQuery AsyncBox弹窗插件

    摘要:脚本资源,jQuery,AsyncBox,弹出窗口,jQuery插件 一款基于jQuery的超漂亮 ... 它内置有拖动器、可设置标题栏图标,可静止定位、动画效果、针对IE6下是否使用 iframe 遮住 select、遮罩层、加载器、按钮式文本等。

    javascript创建页面蒙板的一些知识技巧总结第1/3页

    页面蒙板通常指的是一个覆盖在页面上的一层半透明或不透明的遮罩层,用于突出显示某些特定区域或阻止用户与页面其他部分进行交互。通过设置合适的CSS样式,可以轻松地创建出所需的蒙板效果。 #### 二、创建蒙板的...

    dialogTools-0.1.zip

    dialogTools是一个用于创建自定义对话框的小工具集,它自身不具备UI,但可以很方便的让你设计...dialogTools兼容IE6+与现代浏览器,其中IE6可以与现代浏览器一样实现css2.1 fixed定位,并解决了其select控件遮盖的BUG。

    实现lightBox时的样式与行为分离减少JS第1/2页

    在这个过程中,我们将关注几个关键点,包括全屏遮罩、IE6中隐藏select元素、双向居中以及高度自适应内容。 首先,HTML代码的结构是基于XHTML 1.0 Transitional标准,确保了良好的跨浏览器兼容性。在部分,我们设置...

Global site tag (gtag.js) - Google Analytics