JavaScript幻灯片效果

【 tulaoshi.com - Web开发 】

源程序：
!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
html xmlns="http://www.w3.org/1999/xhtml"
head
meta http-equiv="Content-Type" content="text/html; charset=gb2312" /
meta http-equiv="expires" content="0"
titleJavaScript幻灯片效果/title
style type="text/css"
!--
body { font-size:12px;
}
input {
    border-right: #7b9ebd 1px solid;
 padding-right: 2px;
 border-top: #7b9ebd 1px solid;
 padding-left: 2px;
 font-size: 12px;
 filter: progid:DXImageTransform.Microsoft.Gradient(GradientType=0, StartColorStr=#ffffff, EndColorStr=#cecfde);
 border-left: #7b9ebd 1px solid;
 cursor: hand;
 color: black;
 padding-top: 2px;
 border-bottom: #7b9ebd 1px solid;
}
.img {
 filter:alpha(opacity=1,enabled=1)  blendtrans(duration=1);
    border:1px solid #CCCCCC;
}
--
/style
script language="javascript"
var l=0;
var sum=0;
var _c = 0;
var _i = 0;
var _v = 0;
var _l = 0;
var _fi = 0;
var _sf = 3000;
var _html = null;
var _image = null;
var _mycars= new Array();
var _w = new Array();
var _h = new Array();
var imgs=new Array();
var limg=new Array();

/* 渐隐渐现 */
function  transImg(enable){
 document.getElementById("showimg").filters.blendtrans.Apply();
 document.getElementById("showimg").filters[0].enabled=enable;
 document.getElementById("showimg").filters.blendtrans.Play();
}

/* 加载图片 */

function chk(){
  l--;
  document.getElementById("rotatorPlayer").innerHTML=''img src=''+limg[0].src+''brbr'' + ''照片已加载：'' + parseInt(((sum-

l)*100/sum)).toString() + ''%''
  if (l==0){
      adRotator.play();
   document.getElementById(''stops'').disabled='''';
   document.getElementById(''next'').disabled='''';
  }
}

if (document.images){
  limg[0]=new Image();
  limg[0].src="loading.gif";
  for(var i=0;i13;i++)
  {
    imgs[i]=new Image();
 imgs[i].src=parseInt(i+1)+".jpg";
  }
}

function adRotator() {}

function adRotator.add(p,w,h)
{
   _mycars[_c] = p;
   _w[_c] = w;
   _h[_c] = h;
   _c = _c + 1;
}

/* 播放设置 */
function  adRotator.loads()
{
   if (_i _mycars.length && _l 1)
   {
     _html = ''img id="showimg" src="'' + _mycars[_i] + ''" width="'' + _w[_i] + ''" height="'' + _h[_i] + ''" class="img"''
     if (_v 1)
     {
        document.getElementById(''image'').value = _html + '','' + _i;
        document.getElementById(''rotatorPlayer'').innerHTML = _html;
  transImg(0);
        _i = _i + 1;
  document.getElementById(''backs'').disabled='''';
  transImg(1);
  transImg(0);
        window.setTimeout("adRotator.loads("+_i+")",_sf);
     }
   }
   else
   {

/* 播放 */
function  adRotator.play()
{
   _v = 0;
   _l = 0;
   adRotator.loads();
}

/* 下一张 */
function adRotator.next()
{
   _l = 1;
   if(_i+1 _mycars.length)
   {
      _i = _i + 1;
   document.getElementById(''play'').disabled='''';
   document.getElementById(''stops'').disabled=''True'';
   document.getElementById(''backs'').disabled='''';
   adRotator.loads();
   }
   else
   {
      document.getElementById(''next'').disabled=''True'';
   }
}

/* 上一张 */
function adRotator.backs()
{
   _l = 1;
   if(_i-1 0)
   {
      document.getElementById(''backs'').disabled=''True'';
   }
   else
   {
      _i = _i - 1;
   document.getElementById(''play'').disabled='''';
   document.getElementById(''stops'').disabled=''True'';
   document.getElementById(''next'').disabled='''';
   adRotator.loads();
   }
}

/* 间隔时间 */
function adRotator.set()
{
   var _sfc = document.getElementById(''second'').value;
   if (isInteger(_sfc))
   {
     _sf = _sfc * 1000;
   }
   else
   {
     alert(''提示：只能输入数字！'');
     document.getElementById(''second'').value=1;
     document.getElementById(''second'').select();
   }
}

/* 字符检测 */
function isInteger(str)
{ 
  var regu = /^[-]{0,1}[0-9]{1,}$/;
  return regu.test(str);
}

/* 暂停 */
function adRotator.stops()
{
   _v = 1;
}

/* 添加图片 */
for (var i=0;iimgs.length;i++)
{
   adRotator.add(imgs[i].src,400,300);
}

/script
/head

body
table width="420" border="0" align="center" cellpadding="0" cellspacing="0"
  tr
    td align="center"
div id="rotatorPlayer" style="text-align:center"img src="loading.gif"brbr照片已加载：0%/div
brbr
input type="button" name="play" value="开始播放" onClick="adRotator.play();this.disabled=''true'';document.getElementById

(''stops'').disabled=''''" disabled="True"/
input type="button" name="stops" value="暂停" onClick="adRotator.stops();this.disabled=''true'';document.getElementById

(''play'').disabled=''''" disabled="True"/
input type="button" name="backs" value="上一张" onClick="adRotator.backs();" disabled="True"/
input type="button" name="next" value="下一张" onClick="adRotator.next();" disabled="True"/   
input type="text" id="second" value="3" size="3" maxlength="2"
秒
input type="button" value="设置时间" onClick="adRotator.set()" /
brbr
input name="image" type="text" size="65"/
/td
  /tr
/table
script language="javascript"
sum=l=imgs.length;
for (var i=0;il;i++){
  imgs[i].onload=chk;
  imgs[i].onerror=chk;//无论图片是否加载成功，都执行指定方法
}
/script
/body
/html