// <![CDATA[
$(function(){
    var handler = $('ul#tabMenu li a');
    // ウィンドウを開いた時のタブの位置
    var url = document.URL;
    var urlId = url.substr(url.lastIndexOf('#'));
    var urlIdJudgment = urlId.lastIndexOf('#');
    $('ul#tabMenu').each(function(){
        // #がある場合
        if(urlIdJudgment == 0) {
            handler.each(function(){
                if($(this).attr('href') == urlId) {
                    $(urlId).show();
                    var aimPosition = $('#tabArea').offset();
                    $('html,body').animate({scrollTop:aimPosition.top - 10}, 500); 
                    var imgSrc = $(this).children('img').attr('src');
                    var imgDot = imgSrc.lastIndexOf('.');
                    var onSrc = imgSrc.substr(0, imgDot) + '_on' + imgSrc.substr(imgDot, 4);
                    $(this).children('img').attr('src',onSrc).addClass('onTab');
                }
            });
        }
        // #がない場合は最初のタブを開く
        else {
            $('#tabArea > div:first').show();
            var imgSrc = $('ul#tabMenu li:first img').attr('src');
            var imgDot = imgSrc.lastIndexOf('.');
            var onSrc = imgSrc.substr(0, imgDot) + '_on' + imgSrc.substr(imgDot, 4);
            $('ul#tabMenu li:first img').attr('src',onSrc).addClass('onTab');
        }
    });
    // クリック時の動作
    handler.click(function() {
        // クリックしたタブ画像をオンの状態に
        var imgSrc = $(this).children('img').attr('src').replace(/_on/g, "");
        var imgDot = imgSrc.lastIndexOf('.');
        var onSrc = imgSrc.substr(0, imgDot) + '_on' + imgSrc.substr(imgDot, 4);
        $(this).children('img').attr('src',onSrc);
        // タブ画像の切り替え
        var imgOff = $('ul#tabMenu li img.onTab').attr('src').replace(/_on/g, "");
        $('ul#tabMenu li img.onTab').attr('src',imgOff);
        $('ul#tabMenu li img').removeClass('onTab');
        $(this).children('img').addClass('onTab');
        // コンテンツの切り替え
        var clickAttr = $(this).attr('href');
        var showAttr = '#' + $('#tabArea > div:visible').attr('id');
        if(clickAttr !== showAttr) {
            $('#tabArea > div:visible').hide();
            var showDiv = '#tabArea div' + clickAttr;
            $(showDiv).show();
            return false;
        }
        else {
            // 何度もクリックした場合もタブ画像をオンの状態に
            var imgSrc = $(this).children('img').attr('src').replace(/_on/g, "");
            var imgDot = imgSrc.lastIndexOf('.');
            var onSrc = imgSrc.substr(0, imgDot) + '_on' + imgSrc.substr(imgDot, 4);
            $(this).children('img').attr('src',onSrc);
            return false;
        }
    })
    // ロールオーバー
    handler.hover(function() {
        var classJudgment = $(this).children('img').attr('class');
        if(classJudgment != 'onTab') {
            var imgSrc = $(this).children('img').attr('src');
            var imgDot = imgSrc.lastIndexOf('.');
            var onSrc = imgSrc.substr(0, imgDot) + '_on' + imgSrc.substr(imgDot, 4);
            $(this).children('img').attr('src',onSrc);
        }
    }, function() {
        var classJudgment = $(this).children('img').attr('class');
        if(classJudgment != 'onTab') {
            var imgOff = $(this).children('img').attr('src').replace(/_on/g, "");
            $(this).children('img').attr('src',imgOff);
        }
    });
});
// ]]>