﻿
function initCodaSlider(imgTabName, imgWidth, imgHeight) {

    //example
    //var imgTabName = 'images/tab_server_webmail';

    //make it scrollable
    $("div.scrollable").scrollable({ size: 1 });

    //load tab
    $("div.navi a").each(function (i) {
        /*$(this).html('Scenario ' + (i+1));*/
        var cur = i + 1;
        /*var next = i+2;*/

        var curTabImage = imgTabName + '_0' + cur + '.jpg';
        var curTabOverImage = imgTabName + '_0' + cur + '_over.jpg';
        var curTabActiveImage = imgTabName + '_0' + cur + '_active.jpg';

        $(this).html('<img src="' + curTabImage + '" width="' + imgWidth + '" height="' + imgHeight + '" border="0" /> ');
        $(this).children('img').hover(function () {
            $(this).attr('src', curTabOverImage);
        }, function () {
            if ($(this).parent('a').hasClass('active')) {
                $(this).attr('src', curTabActiveImage);
            } else {
                $(this).attr('src', curTabImage);
            }
        }
				);

        $(this).click(function () {
            $("div.navi a img").each(function (j) {
                var img_cur = j + 1;
                var curTabImage2 = imgTabName + '_0' + img_cur + '.jpg';
                var curTabActiveImage2 = imgTabName + '_0' + img_cur + '_active.jpg';
                if ($(this).parent('a').hasClass('active')) {
                    $(this).attr('src', curTabActiveImage2);
                } else {
                    $(this).attr('src', curTabImage2);
                }
            });
        });

    });
    $("div.navi a:first").click();
}    


