點(diǎn)擊按鈕展示圖片或者關(guān)閉顯示圖片

2011-03-31 圖片特效 ℃

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<title>5454</title> 
<SCRIPT> 
var intTimeStep=20; 
var isIe=(window.ActiveXObject)?true:false; 
var intAlphaStep=(isIe)?5:0.05; 
var curSObj=null; 
var myobj=null;
var mypacity=null;
var curOpacity=null; 
function startObjVisible(objId) 
{ 
curSObj=document.getElementById(objId); 
setObjState(); 
} 
function setObjState(evTarget) 
{ 
if (curSObj.style.display==""){curOpacity=1;mypacity=0;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 ;
myobj.style.opacity=1;
} 
curSObj.style.display=''; 
document.getElementById("MyDiv").style.display="none";
curOpacity=0; 
mypacity=1;
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";document.getElementById("MyDiv").style.display="block";} 
}else{ 
curOpacity-=intAlphaStep; 
if (curOpacity>0) { 
curSObj.style.opacity =curOpacity; 
setTimeout('setObjClose()',intTimeStep);} 
else {curSObj.style.display='none';document.getElementById("MyDiv").style.display="block";} 
} 
} 
</SCRIPT> 
</head> 
<body> 
<table width=80%><tr><td>效果一：手動(dòng)控制展現(xiàn)或消失<br><input type=button onClick="startObjVisible('objDiv');if(this.value=='點(diǎn)擊展現(xiàn)'){this.value='點(diǎn)擊隱藏'}else{this.value='點(diǎn)擊展現(xiàn)'}" value="點(diǎn)擊展現(xiàn)"></td> 
</tr> 
<tr><td><div   class="reb1dvn"   id="objDiv" style="DISPLAY: none;"> 
<img src="/images/tx/meinv.jpg">測試效果<img src="/images/tx/meinv.jpg"></DIV>
<div   class="qivmexp"   id="MyDiv" style="DISPLAY:block;"><img src="/images/tx/meinv.jpg">ddddddd<img src="/images/tx/meinv.jpg"></DIV>
</td></tr> 
</table> 
</body></font>

相關(guān)特效代碼: 水波紋效果變換圖片（圖片帶鏈接）03/28; 拆分后的圖片組合成一張完整的圖特效03/28; 非�？岬亩鄨D片變換代碼03/28; 圖片由馬賽克瞬間變清晰03/28; 彩色圖片變?yōu)楹诎讏D片代碼03/28; 圖片柔化加投影效果代碼03/28; 鼠標(biāo)移到圖片上圖片由無色變?yōu)橛猩?/a>03/28; 圖片倒影代碼03/28; 圖片倒影特效03/28; 動(dòng)感圖片特效03/27

熱門特效代碼: js圖片自動(dòng)切換代碼; CSS實(shí)現(xiàn)區(qū)域內(nèi)等比例放大縮小圖片; JS圖片切換效果; 飄動(dòng)圖片廣告代碼; 鼠標(biāo)經(jīng)過圖片變大; 簡單高效的javascript 幻燈片播放; JavaScript封裝的平滑圖片滾動(dòng)，; 點(diǎn)擊圖片出現(xiàn)大圖; 圖片局部放大效果特效; 圖片上下左右拉伸效果特效

推薦特效代碼: 點(diǎn)擊按鈕淡入淡出彈出圖文信息; 探照燈效果圖片特效代碼; 簡單高效的javascript 幻燈片播放; 飄動(dòng)圖片廣告代碼; JavaScript封裝的平滑圖片滾動(dòng)，; 超酷超絢精美圖片展示效果代碼