var titleHeight = 30;
var foto;
var title;
var slide;
var pos;

$().ready(function() {
	
	foto = $('#foto');
	title = $('#title');
	slide = $('#slide');
	pos = foto.innerHeight() - titleHeight - 1;
	title.css('top', pos+'px');
	title.height(titleHeight);
	title.show();
	
	slide.css('top', titleHeight+'px');
	slide.height(titleHeight);
	loadImg();
});

function loadPopup() {
	window.open(popupUrl, "myWindow", "width=840,height=680,scrollbars=yes");
}

function loadImg() {

	foto = $('#foto');
	foto.css('background-image', 'url('+img+')');
 	foto.load(function() {foto.parent().removeClass('loading');}).animate({opacity: 1} , 1000, function() {init();});
 		

//	foto.removeClass('loading').css('opacity', 0).css('background-image', 'url('+img+')').animate({opacity: 1}, 1500, null, function() {init();});
}

function init() {
	slide.animate({top: titleHeight+"px"}, 1500).animate({top: "0px"}, 700).animate({top: "0px"}, 3000);
	slide.animate({top: titleHeight+"px"}, 700);

	foto.hover(
		function() {slide.stop().animate({top: "0px"}, 700);}, 
		function() {slide.stop().animate({top: titleHeight+"px"}, 700);}
	);
	
}
