//tab effects

var TabbedContent = {
	init: function() {	
		$(".tab_item").mouseover(function() {
			$('.bubble').each(function() {
				if ($(this).css('display') == 'block') {					   
					$(this).fadeOut('fast');
				}
			});
			
			if ($(this).attr('id') == 'text') {
					$('#text_bubble').fadeIn('fast');	
			}
			if ($(this).attr('id') == 'image') {
					$('#image_bubble').fadeIn('fast');	
			}
			if ($(this).attr('id') == 'sound') {
					$('#sound_bubble').fadeIn('fast');	
			}
			if ($(this).attr('id') == 'links') {
					$('#links_bubble').fadeIn('fast');	
			}
			
			var background = $(this).parent().find(".moving_bg");
			
			$(background).stop().animate({
				top: $(this).position()['top']
			}, {
				duration: 300
			});
			
			TabbedContent.slideContent($(this));
			
		});
	},
	
	slideContent: function(obj) {
		
		var margin = $(obj).parent().parent().find(".menu_box").height() + 25;
		margin = margin * ($(obj).prevAll().size() - 1);
		margin = margin * -1;
		
		$(obj).parent().parent().find(".tabslider").stop().animate({
			marginTop: margin + "px"
		}, {
			duration: 300
		});
	}
}

$(document).ready(function() {
	TabbedContent.init();
});