JavaScript实现图片轮换显示几种构思

(1)通过JavaScript和CSS,利用img的src属性实现(在IE较低版本中)

<script language="JavaScript">
 var imgUrl=new Array();
 var imgLink=new Array();
  imgUrl[0]="blog.jpg";
 imgLink[0]="http://www.cnknow.com/"; 
 imgUrl[1]="01.jpg";
 imgLink[1]="http://www.cnknow.com/";

 var imgPre=new Array();
 var adNum=0;

 var j= imgUrl.length;

 function playTran()
 {
   if (document.all)
     imgInit.filters.revealTrans.play();
 }

 function nextAd()
 {
  if(adNum < j-1)
   adNum ++ ;
   else
   adNum=0;
 
  if(document.all)
  {
    imgInit.filters.revealTrans.Transition=100;
    imgInit.filters.revealTrans.apply();
    playTran(); 
  }
  document.images.imgInit.src=imgUrl[adNum];
  theTimer=setTimeout("nextAd()", 2000);
 }
 
 function goUrl()
 {
   jumpUrl=imgLink[adNum];
   jumpTarget='_blank';
   if (jumpUrl != '')
   {
    if(jumpTarget != '')
     window.open(jumpUrl,jumpTarget);
    else
     location.href=jumpUrl;
   }
 }
</script>
</head>
<body>
 <table border="0" cellpadding="0" cellspacing="0">
     <tr>
         <td width="8">
         </td>
         <td>
         <!-- 动态图开始 -->
         <a href="javascript:goUrl()">
         <img style="filter: revealTrans(duration=2,transition=20); border-color: #000000;
         color: #000000" src="javascript:nextAd()" border="1" class="img01" name="imgInit"></a>
   <!-- 动态图结束 --></td>
     </tr>
 </table>
</body>

 

(2)

 

待续……时间原因,本博文推迟发布!

posted @ 2008-08-21 13:15  蓝色乌托邦  阅读(553)  评论(0编辑  收藏  举报