您的位置:首页 > Web前端 > JavaScript

js调用图片隐藏&显示实现代码

2013-09-13 00:00 567 查看
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 

<SCRIPT> 
var intTimeStep=20; 
var isIe=(window.ActiveXObject)?true:false; 
var intAlphaStep=(isIe)?5:0.05; 
var curSObj=null; 
var curOpacity=null; 
function startObjVisible(objId) 
{ 
curSObj=document.getElementById(objId); 
setObjState(); 
} 
function setObjState(evTarget) 
{ 
if (curSObj.style.display==""){curOpacity=1;setObjClose();} 
else{ 
if(isIe) 
{ 
curSObj.style.cssText='DISPLAY: none;Z-INDEX: 1; FILTER: alpha(opacity=0); POSITION: absolute;'; 
curSObj.filters.alpha.opacity=0; 
}else 
{ 
curSObj.style.opacity=0 
} 
curSObj.style.display=''; 
curOpacity=0; 
setObjOpen(); 
} 
} 
function setObjOpen() 
{ 
if(isIe) 
{ 
curSObj.filters.alpha.opacity+=intAlphaStep; 
if (curSObj.filters.alpha.opacity<100) setTimeout('setObjOpen()',intTimeStep); 
}else{ 
curOpacity+=intAlphaStep; 
curSObj.style.opacity =curOpacity; 
if (curOpacity<1) setTimeout('setObjOpen()',intTimeStep); 
} 
} 
function setObjClose() 
{ 
if(isIe) 
{ 
curSObj.filters.alpha.opacity-=intAlphaStep; 
if (curSObj.filters.alpha.opacity>0) { 
setTimeout('setObjClose()',intTimeStep);} 
else {curSObj.style.display="none";} 
}else{ 
curOpacity-=intAlphaStep; 
if (curOpacity>0) { 
curSObj.style.opacity =curOpacity; 
setTimeout('setObjClose()',intTimeStep);} 
else {curSObj.style.display='none';} 
} 
} 
</SCRIPT> 
</head> 
<body>

<input type=text onclick="startObjVisible('objDiv');if(this.value==''){this.value=''}else{this.value=''}" value=""> 
<DIV id="objDiv" style="DISPLAY: none;"><img src="红背心平台/images/城市.jpg"></DIV> 

</body> 
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: