
/* Animated Bubbles */
function InicializarPagina()
{
	
	

				var burbuja1  =  $('#burbuja1');
				var burbuja2  =  $('#burbuja2');				
				var burbuja3  =  $('#burbuja3');
				var burbuja4  =  $('#burbuja4');
				var burbuja5  =  $('#burbuja5');
				
				
				var burbujador1 =  $('#burbujador1');
				var burbujador2 =  $('#burbujador2');
				var burbujador3 =  $('#burbujador3');
				var burbujador4 =  $('#burbujador4');
				var burbujador5 =  $('#burbujador5');
				
				CrearBurbujas(burbujador1,burbuja1);
				CrearBurbujas(burbujador2,burbuja2);
				CrearBurbujas(burbujador3,burbuja3);
				CrearBurbujas(burbujador4,burbuja4);
				CrearBurbujas(burbujador5,burbuja5);
				
				

				

				

}

function CrearBurbujas(burbujador, burbuja)
{
	
	
		/*
		variables CSS
		*/
		var topCSS = -240;
		
		var slide = 10;
		var hideDelay = 120;
		
		var hideDelayTimer = null;
		var beingShown = false;
		var visible = false;
		
		var i=1;
		
				$([burbujador.get(0),burbuja.get(0)]).mouseover(function() {
					if (hideDelayTimer) clearTimeout(hideDelayTimer);
					
					if (beingShown || visible) {
						return;
					} else {
						beingShown = true;
						
						burbuja.css({
							display: 'block',
							
							top: topCSS
						}).animate({
							opacity: 1,
							top: '-=' + slide + 'px'
						}, 184, function() {
							beingShown = false;
							visible = true;
						});
					}
				}).mouseout(function() {
					if (hideDelayTimer) clearTimeout(hideDelayTimer);
					
					hideDelayTimer = setTimeout(function() {
						hideDelayTimer = null;
						burbuja.animate({
							top: '-=' + slide + 'px',
							opacity: 0
						}, 420, function() {
							visible = false;
							$(this).css({
								display: 'none'
							});
						})
					}, hideDelay);
				});	
}
