$(function(){
	var white = $('#showcase .title .white');
	var black = $('#showcase .title .black');
	var ie = (function(){
		var undef, v = 3, div = document.createElement('div');
		while (
			div.innerHTML = '<!--[if gt IE '+(++v)+']><i></i><![endif]-->',
			div.getElementsByTagName('i')[0]
		);
		return v > 4 ? v : undef;
	}());
	var animate = function(el, a, speed){
		if(el===undefined){ return; }
		if(speed===undefined){ speed = 990; }
		if(a===undefined){ a = 1; }
		el.animate({
			opacity: a
		}, speed, "easeOutQuad");
	}
	$('#showcase').showcase();
	$('#showcase').bind("onAnimationStart", function(e, c){
		//console.log(c);// true => black
		if(ie===undefined||ie>=9){
			if(c){
				animate(white, 0);
				animate(black, 1);
			} else {
				animate(white, 1);
				animate(black, 0);
			}
		}
	});
	$('#showcase').bind("onAnimationFinish", function(e, c){
		//console.log(c);// true => black
		if(ie<9){
			if(c){
				white.css('display', 'none');
				black.css('display', 'inline');
			} else {
				white.css('display', 'inline');
				black.css('display', 'none');
			}
		}
	});
	if(ie<9){
		white.css('display', 'none');
		black.css('display', 'inline');
	} else {
		animate(white, 0, 0);
		animate(black, 1, 0);
	}
});