一个图片轮换显示的实现，使用DIV+JS，支持Firefox，IE，Safiri

< div  id ="container"  style ="" >
     < div  id ="subdiv1"  style ="height:200px;width:200px;position:absolute;top:0px;filter:alpha(opacity=100);moz-opacity: 1" ></ div >
     < div  id ="subdiv2"  style ="height:200px;width:200px;position:absolute;top:0px;filter:alpha(opacity=0);moz-opacity: 0" ></ div >
</ div >
< SCRIPT  LANGUAGE ="JavaScript" >
<!--
//从Prototype库抠出来的，版权归Prototype
var Prototype = {
  Version: '1.6.0',

  Browser: {
    IE:     !!(window.attachEvent && !window.opera),
    Opera:  !!window.opera,
    WebKit: navigator.userAgent.indexOf('AppleWebKit/') > -1,
    Gecko:  navigator.userAgent.indexOf('Gecko') > -1 && navigator.userAgent.indexOf('KHTML') == -1,
    MobileSafari: !!navigator.userAgent.match(/Apple.*Mobile.*Safari/)
  },

  BrowserFeatures: {
    XPath: !!document.evaluate,
    ElementExtensions: !!window.HTMLElement,
    SpecificElementExtensions:
      document.createElement('div').__proto__ &&
      document.createElement('div').__proto__ !==
        document.createElement('form').__proto__
  },

  ScriptFragment: '<script[^>]*>([\\S\\s]*?)<\/script>',
  JSONFilter: /^\/\*-secure-([\s\S]*)\*\/\s*$/,

  emptyFunction: function() { },
  K: function(x) { return x }
};

//透明度间变
//id:目标引用，step:变化步长可为正或负，currentValue:当前值，targetValue：目标值
function addOpacity(id,step,currentValue,targetValue)
{
    if(step <0 && currentValue<=targetValue || step >0 && currentValue >= targetValue)
        return;
    currentValue = currentValue + step;
    setOpacity(id,currentValue/100);
    setTimeout(function(){addOpacity(id,step,currentValue,targetValue);},
        50);
}
//设置图片透明度
function setOpacity(id,value)
{
    if(Prototype.Browser.IE) {
         id.filters.alpha.opacity = value*100;
    }
    if(Prototype.Browser.Opera) {
         id.filters.alpha.opacity = value*100;
    }
    if(Prototype.Browser.WebKit) {
        id.style.MozOpacity = value;
        id.style.Opacity = value;
    }
    if(Prototype.Browser.Gecko) {
        id.style.MozOpacity = value;
        id.style.Opacity = value;
    }
    if(Prototype.Browser.MobileSafari) {
        id.style.MozOpacity = value;
        id.style.Opacity = value;
    }
}

//开始轮换图片
/**//*
 * adimages：轮换图片数组
 * curentpos：当前显示的图片序号
 * nextDiv: 轮换div容器，第一个
 * prevDiv: 轮换div容器，上一个
 * timespan: 轮换时间间隔
 */
function switchImage(adimages,curentpos,nextDiv,prevDiv,timespan)
{
    if(adimages && adimages.length == 0) return;
    if(curentpos >= adimages.length)
        curentpos = 0;

    nextDiv.innerHTML = "<img src='" + adimages[curentpos].imgUrl + "' />";

    addOpacity(prevDiv,-5,100,0);
    addOpacity(nextDiv,5,0,100);

    var temp = prevDiv;prevDiv = nextDiv;nextDiv = temp;

    curentpos++;
    setTimeout(function(){switchImage(adimages,curentpos,nextDiv,prevDiv,timespan);},
        timespan);
}
var r = document.getElementById("subdiv1");
var s = document.getElementById("subdiv2");
var imgs = [
    {'imgUrl':'banner01.jpg',href:''},
    {'imgUrl':'20083174103502.jpg',href:''}
];
switchImage(imgs,0,r,s,5000);
//-->
</ SCRIPT >