// 切り替え秒数の設定 var sec = 2000;

// 最初の画像を表示 var index = 0;

// 画像切り替え処理 setInterval(function(){ index++; // インデックスの初期化 if (index >= $('#main-visual2').children().length) index = 0;

// スクロールのアニメーション var mt = 250 * (index) * -1; $('#main-visual2').animate( { marginTop: mt + "px" } ); }, sec); });

jQueryとsetIntervalを使った簡単な画像切替スクリプトを作成してみます。
今回は縦にスライドです。
まずはスタイルシートの設定で、表示領域（画像）のサイズを設定します。

IDがmain-visual2に格納されたオブジェクトを切り替え対象にするので、下記のようにmain-visual2というIDのボックスを用意し、その中に画像を配置します。
アンカーはつけても付けなくても大丈夫です。

最後にJavaScriptを記述します。JavaScriptとStyle設定はHEAD要素に書くといいでしょう。
jQueryを最初に読み込み、ドキュメントが構築された後に実行するように$(function(){})の中にコードを記述します。

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script>
<script>
$(function(){

	// 切り替え秒数の設定
	var sec		= 2000;

	// 最初の画像を表示
	var index = 0;

	// 画像切り替え処理
	setInterval(function(){
		index++;
		// インデックスの初期化
		if (index >= $('#main-visual2').children().length) index = 0;

		// スクロールのアニメーション
		var mt	= 250 * (index) * -1;
		$('#main-visual2').animate(
			{ marginTop: mt + "px" }
		);
	}, sec);
});
</script>

コメントを読めば大体の内容がわかる簡単なスクリプトです。