首页
网页特效库
网页特效库
导航菜单
按钮表单
背景特效
时间日期
图片特效
鼠标特效
文本操作
窗口页面
状态栏类
警告对话
综合应用
游戏娱乐
首页
>
特效
>
图片特效
> 正文
点击按钮展示图片或者关闭显示图片
2011-03-31 图片特效 436℃
<!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>效果一:手动控制展现或消失<br><input type=button onClick="startObjVisible('objDiv');if(this.value=='点击展现'){this.value='点击隐藏'}else{this.value='点击展现'}" value="点击展现"></td> </tr> <tr><td><DIV id="objDiv" style="DISPLAY: none;"> <img src="/images/tx/meinv.jpg">测试效果<img src="/images/tx/meinv.jpg"></DIV> <DIV id="MyDiv" style="DISPLAY:block;"><img src="/images/tx/meinv.jpg">ddddddd<img src="/images/tx/meinv.jpg"></DIV> </td></tr> </table> </body></font>
相关特效代码
水波纹效果变换图片(图片带链接)
03/28
拆分后的图片组合成一张完整的图 特效
03/28
非常酷的多图片变换代码
03/28
图片由马赛克瞬间变清晰
03/28
彩色图片变为黑白图片代码
03/28
图片柔化 加投影效果代码
03/28
鼠标移到图片上图片由无色变为有色
03/28
图片倒影代码
03/28
图片倒影特效
03/28
动感图片特效
03/27
热门特效代码
js图片自动切换代码
CSS实现区域内等比例放大缩小图片
JS图片切换效果
飘动图片广告代码
鼠标经过图片变大
简单高效的javascript 幻灯片播放
JavaScript封装的平滑图片滚动,
点击图片出现大图
图片局部放大效果特效
图片上下左右拉伸效果特效
推荐特效代码
点击按钮淡入淡出弹出图文信息
探照灯效果图片特效代码
简单高效的javascript 幻灯片播放
飘动图片广告代码
JavaScript封装的平滑图片滚动,
超酷超绚精美图片展示效果代码