js实现图片从左往右渐变切换效果的方法

本文实例讲述了js实现图片从左往右渐变切换效果的方法。分享给大家供大家参考。具体实现方法如下：

代码如下:
<style type="text/css">
.woon{border:1px solid #fff;}
.wooff{border:1px solid #ffffff;filter:progid:DXImagetransform.Microsoft.Alpha(style=1,opacity=1500,finishOpacity=1);}
</style>
<script language="JavaScript" type="text/JavaScript">
<!--
window.onerror = function(){return true}
function MM_openBrWindow(theURL,winName,features) { //v2.0
  window.open(theURL,winName,features);
}
//-->
</script>
<table width=500 border=0 align=center cellPadding=0 cellSpacing=0  background="http://s16.sinaimg.cn/middle/60d27f6dt7942731cd87f&690">
    <tr>
      <td height="300" align="center">
        <div id=fc style="filter:progid:DXImagetransform.Microsoft.GradientWipe(duration=3,gradientSize=0.5,motion=forward ); WIDTH:500px; HEIGHT:260px; border:1px solid #99cc66">
          <div style="display:block"><A
                  href="#" target=_blank><img onmouseover=clearAuto(); onmouseout=setAuto() height=300 src="http://s15.sinaimg.cn/middle/60d27f6dtbc987f277bde&690" width=500 border=0></A></div>
        
        <div style="display: none"><a href="#" target="_blank"><img onmouseover=clearAuto(); onmouseout=setAuto() height=300 src="http://s10.sinaimg.cn/middle/60d27f6dtbc987f42b6b9&690" width=500 border=0></a></div>
        
        <div style="display: none"><A href="#" target=_blank><img onmouseover=clearAuto(); onmouseout=setAuto() height=300 src="http://s4.sinaimg.cn/middle/60d27f6dtbc987f3c3303&690" width=500 border=0></A></div>
        <div style="display: none"><a href="#" target=_blank><img onmouseover=clearAuto(); onmouseout=setAuto() height=300 src="http://s12.sinaimg.cn/middle/60d27f6dt7942732166fb&690" width=500 border=0></a></div>
      </div></td>
    </tr>
    <tr>
      <td height=100 valign="top"> <table border=0 align=center cellPadding=0 cellSpacing=1 id=num>     
          <tr>
           
          <td class=woon onmouseover=clearAuto();onclick=Mea(0); onmouseout=setAuto() >