不会被下边select遮挡的日历控件 日历控件被select遮挡

关键字: 日历控件 被select遮挡  不被遮挡

      如果网页上弹出的日历控件和下拉选单重叠时,在IE6会看到下拉选框总是把浮动区块覆盖住,无论怎么调整 z-index 都是没用的。下面为大家介绍一种不会被下拉选单遮挡的日历控件。 (日历控件请在下面下载)


一、发生情况:
不会被下边select遮挡的日历控件 日历控件被select遮挡
二、在这种情况下日历控件展开式会被下部的  城市 (select类型) 遮挡一部分

效果如下图:
不会被下边select遮挡的日历控件 日历控件被select遮挡


三、我们需要的最终效果。
不会被下边select遮挡的日历控件 日历控件被select遮挡
日历控件用法:

1.引入rl.js

<script src="js/rl.js" language="javascript" type="text/javascript"></script>

 
2.点击文本框出来日历选择层:

日期:<input type="text" id="date" onClick="SelectDate(this.name)" name="date"/>

 

3.控件引入之后还出现上"图二"的遮挡效果,解决方法:

双击打开rl.js,找到下边的代码(将注释去掉问题解决):

//if(document.all)
//{
//document.write('<iframe style="position:absolute;z-index:2000;width:expression(this.previousSibling.offsetWidth);');
//document.write('height:expression(this.previousSibling.offsetHeight);');
//document.write('left:expression(this.previousSibling.offsetLeft);top:expression(this.previousSibling.offsetTop);');
//document.write('display:expression(this.previousSibling.style.display);" scrolling="no" frameborder="no"></iframe>');
//}

 
再去看看你的页面是不是问题解决了。

清风夜影寒:http://qfyyh.iteye.com

 

你可能感兴趣的:(JavaScript,ITeye)