// JavaScript Document




$(function(){
	var btn1 = $('#btn01');
	var btn2 = $('#btn02');
	var btn3 = $('#btn03');
	var btn4 = $('#btn04');
	
	var mbtn1 = $('#mbtn01');
	var mbtn2 = $('#mbtn02');
	var mbtn3 = $('#mbtn03');
	var mbtn4 = $('#mbtn04');
	var mbtn5 = $('#mbtn05');
	var mbtn6 = $('#mbtn06');
	
	var tabb = btn1;
	var subtabb = mbtn1;
	var subsubtabb;
// ------------------ tab
  btn1.click(function(){
    $('#cate01,#btn01_on').show();
    $('#cate02,#btn02_on,#cate03,#btn03_on,#cate04,#btn04_on').hide();
	tabb = $(this);
	AllBlank();
  });
  btn2.click(function(){
    $('#cate02,#btn02_on').show();
    $('#cate01,#btn01_on,#cate03,#btn03_on,#cate04,#btn04_on').hide();
	tabb = $(this);
  });
  btn3.click(function(){
    $('#cate03,#btn03_on').show();
    $('#cate01,#btn01_on,#cate02,#btn02_on,#cate04,#btn04_on').hide();
	tabb = $(this);
  });
  btn4.click(function(){
    $('#cate04,#btn04_on').show();
    $('#cate01,#btn01_on,#cate02,#btn02_on,#cate03,#btn03_on').hide();
	tabb = $(this);
  });
  mbtn1.mouseover(function(){
    $('#prod01,#mbtn01_on').show();
    $('#prod02,#mbtn02_on,#prod03,#mbtn03_on,#prod04,#mbtn04_on').hide();
  });
  mbtn2.mouseover(function(){
    $('#prod02,#mbtn02_on').show();
    $('#prod01,#mbtn01_on,#prod03,#mbtn03_on,#prod04,#mbtn04_on').hide();
  });
  mbtn3.mouseover(function(){
    $('#prod03,#mbtn03_on').show();
    $('#prod01,#mbtn01_on,#prod02,#mbtn02_on,#prod04,#mbtn04_on').hide();
  });
  mbtn4.mouseover(function(){
    $('#prod04,#mbtn04_on').show();
    $('#prod01,#mbtn01_on,#prod02,#mbtn02_on,#prod03,#mbtn03_on').hide();
  });
  mbtn5.mouseover(function(){
    $('#prod05,#mbtn05_on').show();
    $('#prod06,#mbtn06_on').hide();
  });
  mbtn6.mouseover(function(){
    $('#prod06,#mbtn06_on').show();
    $('#prod05,#mbtn05_on').hide();
  });
  
// ------------------ image changer
  	$('img.imgbtn01').mouseover(function(){
		$(this).parent().parent().parent().find('img.img01').fadeIn().end();
		$(this).parent().parent().parent().find('img.img02').fadeOut().end();
		$(this).parent().parent().parent().find('img.img03').fadeOut().end();
		$(this).parent().parent().parent().find('img.img04').fadeOut().end();
	});
	$('img.imgbtn02').mouseover(function(){
		$(this).parent().parent().parent().find('img.img01').fadeOut().end();
		$(this).parent().parent().parent().find('img.img02').fadeIn().end();
		$(this).parent().parent().parent().find('img.img03').fadeOut().end();
		$(this).parent().parent().parent().find('img.img04').fadeOut().end();
	});
	$('img.imgbtn03').mouseover(function(){
		$(this).parent().parent().parent().find('img.img01').fadeOut().end();
		$(this).parent().parent().parent().find('img.img02').fadeOut().end();
		$(this).parent().parent().parent().find('img.img03').fadeIn().end();
		$(this).parent().parent().parent().find('img.img04').fadeOut().end();
	});
	$('img.imgbtn04').mouseover(function(){
		$(this).parent().parent().parent().find('img.img01').fadeOut().end();
		$(this).parent().parent().parent().find('img.img02').fadeOut().end();
		$(this).parent().parent().parent().find('img.img03').fadeOut().end();
		$(this).parent().parent().parent().find('img.img04').fadeIn().end();
	});
});

function AllBlank()
{
	
}


// ------------------ overImage

jQuery(document).ready(function($){
	$('#btn01,#btn02,#btn03,#btn04,#mbtn01,#mbtn02,#mbtn03,#mbtn04,#mbtn05,#mbtn06,.imgbtn01,.imgbtn02,.imgbtn03,.imgbtn04').rollover();
});

jQuery.fn.rollover = function(suffix) {
	suffix = suffix || '_on';
	return this.not('[src*="'+ suffix +'."]').each(function() {
		var img = jQuery(this);
		var src = img.attr('src');
		var _on = [
			src.substr(0, src.lastIndexOf('.')),
			src.substring(src.lastIndexOf('.'))
		].join(suffix);
		jQuery('<img>').attr('src', _on);
		img.hover(
			function() { img.attr('src', _on); },
			function() { img.attr('src', src); }
		);
	});
};