JQuery隐藏显示过快，出现闪退，ie6不兼容问题

0 0

JQuery隐藏显示过快，出现闪退，ie6不兼容问题0

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>JQuery动画 2014/02/20 赵小宾</title>
<link rel="stylesheet" type="text/css" href="css/zzsc.css" />
<style type="text/css">
</style>
<script language="javascript" src="js/jquery-1.11.0.min.js"></script>
<script language="javascript" src="js/jquery.timers.js"></script>
<script type="text/javascript">
    $(document).ready(function(){
	    
    /*
	 * 宽窄屏切换
	 * */
	var bigscreen = false;
	if (screen.width >= 1200) {
		bigscreen = true;
		var bodyTag = document.getElementsByTagName("body")[0];
		var bodyClassName = bodyTag.getAttribute("className")|| bodyTag.getAttribute("class");
		bodyClassName = bodyClassName ? bodyClassName + " " : "";
		bodyTag.className = bodyClassName + "root1200";
	}
	
	var h = 0, w, imgSrc = [];
	if (bigscreen) {
		w = 1190;
		imgSrc[0] = "images/l.jpg";// 40
		imgSrc[1] = "images/m.jpg";//  500
	} else {
		w = 990;
		imgSrc[0] = "images/ll.jpg";// 40
		imgSrc[1] = "images/mmm.jpg";//  500
	}
	$("#showImg").css("overflow","hidden");
	$("#bigImg").hide();
	$("#smallImg").html('<img width="' + w + '" height="40" src="' + imgSrc[0] + '" style="display:block" />');
	$("#bigImg").html('<img width="' + w + '" height="500" src="' + imgSrc[1] + '" style="display:block" />');
	
	$("input").hide();
	$("em").hide();
	var clickClose=true;
	var t;
	//timeout = !1;
  	
		$("#showImg").mouseover(function(e){
		if(clickClose){
	    	$("#smallImg").hide();
	    	$("#bigImg").show();
	    	$("em").hide();
	    	$("input").show();
			t = setTimeout(function() {
	    	//$(this).oneTime("5s","hi",function(){
		    	$("#bigImg").hide();
		    	$("input").hide();
		    	//$("em").show();
		    	$("#smallImg").show();
		    	}, 5000);
	    	$("input").click(function(){
				$("#bigImg").hide();
				$("input").hide();
		    	$("#smallImg").show();
		    	$("em").show();
		    	clickClose=false;
			});
			//clickClose=false;
		}
  	});
  	
	$("#showImg").mouseout(function(e){
	 if(clickClose){
		$("#bigImg").hide();
    	$("input").hide();
    	//$("em").show();
    	$("#smallImg").show();
		$("em").click(function(){
	    	$("#smallImg").hide();
            $("#smallImg").css("display","none");
	    	$("em").hide();
	    	$("input").hide();
	    	//$("#showImg").stopTime();
			clearTimeout(t);
		});
		 }
  	});
	
	
		
  
});
	
		
</script>
</head>

<body>
	<div class="wrapper" id="showImg">
		<em title="关闭广告">Close</em>
		<input name="close" type="button"/> 
		<a id="smallImg" target="_blank" name="small" title="小图" href="http://www.tospur.com/index.html"></a>
		<a id="bigImg" target="_blank" name="big" title="大图" href="http://www.tospur.com/index.html"></a>
		
	</div>
	<span style='clear:both;'/>

	<div style="text-align:left;clear:both">
		<p>广告小图，鼠标触碰后自动出现大图。</p>
		<p>在大图上有个关闭按钮，点击后可以把广告位缩小成原来样，小图上还有个关闭按钮，可让广告不显示页面成空白。</p>
		<p>另，当广告大图显示时，鼠标放大图上，图片一直展开，当鼠标放空白处，图片自动缩小。</p>
		<p>大图展示时间为5秒，第6秒，图片自动缩小。
		<br>
		<h5>经IE11、FireFox27、猎豹浏览器测试，运行正常。</h5>
			</div>
</body>
</html>

出现闪烁，怎样解决？还有想让大图隐藏、显示慢点，怎样？ie6不兼容，隐藏之后有空白，而且小图隐藏之后还会再出来！