首页
网页特效库
网页特效库
导航菜单
按钮表单
背景特效
时间日期
图片特效
鼠标特效
文本操作
窗口页面
状态栏类
警告对话
综合应用
游戏娱乐
首页
>
特效
>
图片特效
> 正文
图片忽大忽小变化特效
2011-03-31 图片特效 322℃
<p>要完成此效果需要两个步骤 第一步:把如下代码加入到区域中 <script> <!-- var imageheight=280 var imagewidth=560 var cliptop var clipbottom var clipleft var clipright var clippoints var tempo=100 var stepx=0 var stepy=0 var timer function setValues() { if (document.all) { document.all.image.style.posLeft=0 document.all.image.style.posTop=0 document.all.imagecontent.style.posLeft=0 document.all.imagecontent.style.posTop=0 moveimage() } } function moveimage() { if (stepx<=imagewidth || stepy<=imageheight) { stepx=stepx+12 stepy=stepy+6 image.innerHTML="<span style='width:"+stepx+"px; height:"+stepy+"px;background-color:000000;filter:alpha(opacity=0,finishopacity=100,style=2'></span>" cliptop=0 clipbottom=stepy clipleft=0 clipright=stepx clippoints="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")" document.all.imagecontent.style.clip=clippoints timer=setTimeout("moveimage()",tempo) } else{ clearTimeout(timer) timer=setTimeout("moveimage2()",tempo) } } function moveimage2() { if (stepx>=0 || stepy>=0) { stepx=stepx-12 stepy=stepy-6 image.innerHTML="<span style='width:"+stepx+"px; height:"+stepy+"px;background-color:000000;filter:alpha(opacity=0,finishopacity=100,style=2'></span>" cliptop=0 clipbottom=stepy clipleft=0 clipright=stepx clippoints="rect("+cliptop+" "+clipright+" "+clipbottom+" "+clipleft+")" document.all.imagecontent.style.clip=clippoints timer=setTimeout("moveimage2()",tempo) } else{ stepx=0 stepy=0 clearTimeout(timer) timer=setTimeout("moveimage()",tempo) } } --> </script></p> <div id="imagecontent" style="position: absolute; top: -5000px; left: -5000px"><img alt="" width="735" height="421" onload="return imgzoom(this,600);" style="cursor: pointer" src="/images/tx/meinv.jpg" /></div> <div id="image" style="position: absolute; top: -50px"> </div> <p>第二步:把“onload=setValues()”加在标记里例如:</p>
相关特效代码
水波纹效果变换图片(图片带链接)
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封装的平滑图片滚动,
超酷超绚精美图片展示效果代码