window.onload = function() {

// 画像のノードリストを渡して画像を切り替える関数を返すクラス風の関数
var ChangeElementInterval = function(nodeList) {

var s = document.body.style;
// 透明度の設定をする関数
// elem: 透明度を設定する要素
// opacity: 透明度[%]
var setOpacity =
s.opacity !== undefined ? function(elem, opacity) { elem.style.opacity = opacity / 100; }:
s.filter !== undefined ? function(elem, opacity) { elem.style.filter = 'alpha(opacity=' + opacity + ')'; }:
function(elem, opacity) { elem.style.MozOpacity = opacity / 100; };

// 画像の要素を取得
// 非表示要素にopacity=0を設定するループ
for (var i = 0; i < nodeList.length; i++) {
// .style.display == nullは旧Safariのバグ対応
if (nodeList[i].style.display == 'none' || nodeList[i].style.display == null) setOpacity(nodeList[i], 0);
// 表示要素の番号
else var index = i;
}

// 透明度を変えていく関数
// elem: ターゲット要素
// from: はじめの透明度
// to: 終わりの透明度
// time: 切り替える時間[ms]
// callback: 終わったら実行する関数
var changeOpacity = function(elem, from, to, time, callback) {
// 透明度の変更をする関数を呼び出すインターバル
var interval = 80;
var curr = from;
var step = (to - from) * interval / time;
(function () {
var c = Math.round(curr += step);
setOpacity(elem, c);
if(c != to) {
if ((curr + step - to) * (curr - to) < 0) step = to - curr;
setTimeout(arguments.callee, interval);
}
else if (callback) callback.call(elem, to);
})();
};

// 表示を切り替える関数,changeOpacityを呼び出す
// from: 切り替える前の要素
// to: 切り替える要素
// time: 切り替える時間
var changeElem = function(from, to, time) {
if (to.style.removeProperty) to.style.removeProperty('display');
else to.style.display = ''; /* for IE */
changeOpacity(from, 100, 0, time, function() { this.style.display = 'none'; });
changeOpacity(to, 0, 100, time);
};

// 画像を一定間隔で切り替える関数を返す。
// interval: 画像の表示間隔[ms]
// time: 切り替わる時間[ms]
return function(interval, time, callback) {
setTimeout(function() {
changeElem(nodeList[index], nodeList[++index >= nodeList.length ? (index = 0) : index], time);
changeImgInterval(interval, time)
}, interval);
};
};

// 引数に画像のノードリストを渡すと、切り替え関数が返される
var changeImgInterval = ChangeElementInterval(document.getElementById('img-wrapper').getElementsByTagName('img'));

// 5秒間隔に画像を切り替え、0.5秒で表示を切り替える
changeImgInterval(5000, 500);
};
