prototype.js + effects.jsでカルーセル表示実装

<div id="carousel">
    <div class="tabs">
        <div id="tab_0" class="tab">
            <a href="#" onclick="javascript:carouselTabClicked(0);return false;">
                tab01
            </a>
        </div>
        <div id="tab_1" class="tab">
            <a href="#" onclick="javascript:carouselTabClicked(1);return false;">
                tab02
            </a>
        </div>
        <div id="tab_2" class="tab">
            <a href="#" onclick="javascript:carouselTabClicked(2);return false;">
                tab03
            </a>
        </div>
        <div id="tab_3" class="tab">
            <a href="#" onclick="javascript:carouselTabClicked(3);return false;">
                tab04
            </a>
        </div>
    </div>
       
    <div id="tab_body0" class="slide">
        自動切り替える表示コンテンツ１（html要素）
    </div>
       
    <div id="tab_body1" class="slide" style="display: none;">
        自動切り替える表示コンテンツ２（html要素）
    </div>
       
    <div id="tab_body2" class="slide" style="display: none;">
        自動切り替える表示コンテンツ３（html要素）
    </div>
       
    <div id="tab_body3" class="slide" style="display: none;">
        自動切り替える表示コンテンツ４（html要素）
    </div>
</div>
      
   
<script src="carousel_files/prototype.js" type="text/javascript">
</script>
<script src="carousel_files/effects.js" type="text/javascript">
</script>
<script>
    var carousels = ['body0', 'body1', 'body2', 'body3']    //suffix
    var currentTabIndex = 0;
    var carouselTabIndex = 0;
    //タブをクリック時イベント・メソッド
    function carouselTabClicked(index) {
        if (currentTabIndex != index) {
            if (carouselTabIndex != 0) {
                clearTimeout(carouselTabIndex);
                carouselTabIndex = 0;
                setTimeout('carouselTabClicked(' + index + ')', 300);
                return;
            }
            selectCarouselTab(index);
        }
    }

    //タブの自動切り替える表示
    function autoChangeTab() {
        nextabIndex = (currentTabIndex + 1) % carousels.length;        //次の表示するタブのindex
        selectCarouselTab(nextabIndex);                //
        startCarouselTimer();
    }

    //タイマー
    function startCarouselTimer() {
        carouselTabIndex = setTimeout("autoChangeTab()", 1000);
    }

    //タブを表示させる
    function selectCarouselTab(idIndex) {
        $('tab_' + currentTabIndex).className = 'tab';    //現在表示しているタブ「ヘッダ」のclass属性をtabに設定
        $('tab_' + idIndex).className = 'tab selected';    //指定するタブ「ヘッダ」のclass属性をtab selectedに設定

        new Effect.Fade("tab_" + carousels[currentTabIndex], {duration: 1});     //現在表示しているタブ「詳細」を非表示
        new Effect.Appear("tab_" + carousels[idIndex], {duration: 1});         //指定するタブ「詳細」を表示
        currentTabIndex = idIndex; 
    }
    startCarouselTimer();    //自動切り替える表示する

</script>