您当前所在位置:    首页 > 代码集锦
返回
图片渐变特效
时间:2019-11-23    来自:臻心网络科技

本特效实现以下效果:
当鼠标移到图片上的时候,由透明度低变换在透明度高。也可以相对应的反过来。呵呵,
其实这种效果在网页里面还是比较常用的。

实现方法如下,把以下代码放置<body></body>之间即可。

<script language="JavaScript">
// Flash Image Extension for Dreamwever ,by webjx.com(tslxg@hotmail.com)
nereidFadeObjects = new Object();
nereidFadeTimers = new Object();
function nereidFade(object, destOp, rate, delta){
if (!document.all)
return
if (object != "[object]"){ //do this so I can take a string too
setTimeout("nereidFade("+object+","+destOp+","+rate+","+delta+")",0);
return;
}
clearTimeout(nereidFadeTimers[object.sourceIndex]);
diff = destOp-object.filters.alpha.opacity;
direction = 1;
if (object.filters.alpha.opacity > destOp){
direction = -1;
}
delta=Math.min(direction*diff,delta);
object.filters.alpha.opacity+=direction*delta;
if (object.filters.alpha.opacity != destOp){
nereidFadeObjects[object.sourceIndex]=object;
nereidFadeTimers[object.sourceIndex]=setTimeout("nereidFade(nereidFadeObjects["+object.sourceIndex+"],"+destOp+","+rate+","+delta+")",rate);
}
}
</script>

{nextpage}
<!--把下面代码放到<body>区域中-->
<div align="center">
<a href="http://www.86design.com.cn/" target="_blank"><img src="/texiaop/meimeic.jpg" onMouseOut=nereidFade(this,50,10,5) onMouseOver=nereidFade(this,100,10,5) style="FILTER: alpha(opacity=55)" width="170" height="233"></a>
<br>
<a href="http://www.86design.com.cn" target="_blank"><img src="/texiaop/meimei.jpg" onMouseOut=nereidFade(this,50,10,5) onMouseOver=nereidFade(this,100,10,5) style="FILTER: alpha(opacity=55)" width="170" height="120"></a>
</div>
<img width="100" height="100" border="0" style="FILTER: alpha(opacity=100)" onmouseover=nereidFade(this,50,3,5)onmouseout=nereidFade(this,100,3,5)>

 
关注微信公众号
 

在线咨询

一键通话

联系我们