文档章节

jQuery easy UI messager IE6下select 框穿过层的解决方案

William
 William
发布于 2010/05/20 12:56
字数 449
阅读 3332
收藏 2

在使用jQuery easy UI messager 过程中有可能会碰到这种问题,之前时间脚本控件在IE6下也会出现这种情况,界面很不友好

网上有一种解决方法:

  1. jQuery.fn.activeXOverlap = function() {    
  2.   
  3.     $(this).each(function(i){   
  4.         var h   = $(this).outerHeight();   
  5.         var w   = $(this).outerWidth();   
  6.         var iframe  = ''  
  7.         $(this).prepend(iframe);   
  8.     });   
  9. }  
  10. $(function() {   
  11.     $('.myHoverClass').activeXOverlap();   
  12. });  

请注意这是事件切换的时候才会发生,但是停止拖动的时候还是会穿过层,而且这种方式本人没有测试通过,

详见:http://herr-schuessler.de/blog/overlapping-select-field-bug-in-ie6-solved-jquery-style/

下面说说解决方法:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<title>jQuery.html</title>
		<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
		<meta http-equiv="description" content="this is my page">
		<meta http-equiv="content-type" content="text/html; charset=UTF-8">
		<link rel="stylesheet" type="text/css" href="jquery/themes/default/easyui.css">
		<link rel="stylesheet" type="text/css" href="jquery/themes/icon.css">
		<script type="text/javascript" src="jquery/jquery-1.4.2.min.js"></script>
		<script type="text/javascript" src="jquery/jquery.easyui.min.js"></script>
		<style type="text/css">
		input, select,textarea {
			padding:1px;
			margin:2px;
			font-size:11px;
		}
		</style>
		<script type="text/javascript">
		$.messager.defaults={ok:"确定",cancel:"取消"};
		function alert(msg){
			$.messager.alert('警告对话框',msg,'warning');
			fixIE6SelectZindexIssue();
		}        
		//将锁屏警告对话框拖动到select元素上测试看看效果
		function test(){
			alert($('#name').attr("value"));
		}
		//jquery easy UI messager ie6下下拉列表穿过层的解决方法
		function fixIE6SelectZindexIssue(){
			if($.browser.msie&&parseInt($.browser.version)<=6){//判断浏览器及其版本,如果是IE6及其以下版本统一这样处理
				$("select").css({visibility:"hidden"});
				$("div.panel").ready(function(){
					$("div.panel-tool-close").bind("click",function(){//当点击‘关闭’按钮时使下拉框可见
						$("select").css({visibility:"visible"});
					});
					$("a.l-btn").bind("click",function(){//当点击‘确定’按钮时使下拉框可见
						$("select").css({visibility:"visible"});
					});
				});
			}
		}
	</script>
	</head>

	<body>
	<pre>
		
		
		
		
	</pre>
		<input id="name" value="-----" style="BACKGROUND-COLOR: transparent;" >
		<select style="width:200">
			<option>BMW</option>
			<option>MSN</option>
			<option></option>
			<option></option>
		</select>
		<br>
		<button onclick="test();" value="test" style="width: 260px; heigth: 150px;">拖动警告对话框到select元素上测试</button>
	</body>
</html>

 

© 著作权归作者所有

William
粉丝 8
博文 26
码字总数 7874
作品 0
浦东
程序员
私信 提问
加载中

评论(1)

赖杰
赖杰
简单点的:直接用 easyUI 的 combobox 替代 select
jQuery-dialog在ie6下被下拉框(select)覆盖问题

最近在解决jQuery在ie6下的兼容性时,发现一个问题,在此与大家分享,并希望大家给予宝贵的建议 问题如下: 在ie6下使用jQuery的dialog弹出框时,若不引入jquery.bgiframe.js时,会出现下拉框...

wellyc
2013/02/22
1K
7
12306前台页面技术

通过火狐浏览器,查看源代码的方式我看到12306某个页面引用的东西, 1、jquery-1.4.2.min.js; 2、jquery.easyui.min.js 和easyui.css 实现可拖动的表格(他把样式改了); 3、jquery-ui-1.8.2...

fanyongwei3
2013/02/06
1K
10
搜索答案之-jquery MultiSelect 答案搜索历程

Jquery MultiSelect 这个多选下拉框控件,相信很多人都用过。 最近项目中要用到,于是到网上下载下来,发现兼容性好,操作方便。 1.相比于 dropdown select list ,对ie6兼容性更好,体现在对...

shengfuqiang
2018/06/29
0
0
jQuery UI dialog 的使用

jQuery UI dialog 的使用 上一篇文章分享了一下 jQuery UI dialog 的简单使用,看到这么多同学都在学习,就将 jQuery UI dialog 的使用总结一下,也为学习其他的 jQuery UI 打个基础。 初始化...

Neo_
2013/03/30
180
0
jquery常用的插件1000收集

花N长时间积累的Jquery插件,希望大家喜欢。大家还有什么新的插件,请留言,我们一并收录。 感谢大家的支持。 1.accordion类 基于jQuery开发,非常简单的水平方向折叠控件。 Horizontal acc...

Alic
2011/03/07
9.3K
6

没有更多内容

加载失败,请刷新页面

加载更多

64.监控平台介绍 安装zabbix 忘记admin密码

19.1 Linux监控平台介绍 19.2 zabbix监控介绍 19.3/19.4/19.6 安装zabbix 19.5 忘记Admin密码如何做 19.1 Linux监控平台介绍: 常见开源监控软件 ~1.cacti、nagios、zabbix、smokeping、ope...

oschina130111
今天
13
0
当餐饮遇上大数据,嗯真香!

之前去开了一场会,主题是「餐饮领袖新零售峰会」。认真听完了餐饮前辈和新秀们的分享,觉得获益匪浅,把脑子里的核心纪要整理了一下,今天和大家做一个简单的分享,欢迎感兴趣的小伙伴一起交...

数澜科技
今天
7
0
DNS-over-HTTPS 的下一代是 DNS ON BLOCKCHAIN

本文作者:PETER LAI ,是 Diode 的区块链工程师。在进入软件开发领域之前,他主要是在做工商管理相关工作。Peter Lai 也是一位活跃的开源贡献者。目前,他正在与 Diode 团队一起开发基于区块...

红薯
今天
10
0
CC攻击带来的危害我们该如何防御?

随着网络的发展带给我们很多的便利,但是同时也带给我们一些网站安全问题,网络攻击就是常见的网站安全问题。其中作为站长最常见的就是CC攻击,CC攻击是网络攻击方式的一种,是一种比较常见的...

云漫网络Ruan
今天
12
0
实验分析性专业硕士提纲撰写要点

为什么您需要研究论文的提纲? 首先当您进行研究时,您需要聚集许多信息和想法,研究论文提纲可以较好地组织你的想法, 了解您研究资料的流畅度和程度。确保你写作时不会错过任何重要资料以此...

论文辅导员
今天
8
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部