fall / 2014/05/14

JS

// カラーセット
$('.box').each(function(){
	$('.thumb' ,this).append('');
	var col = new Array('#1dd2af','#f1c40f','#2ecc71','#e67e22','#3498db','#e74c3c','#9b59b6','#34495e','#95a5a6');
	var rnd = Math.floor(Math.random()*9); // 色の数を指定
	var str = col[rnd];
	col[0] = str;
	$('span.color' ,this).css({'background':col[0]});
});

// 遅延表示
var setElm = $('span.color'),
delaySpeed = 50;
$(window).load(function(){
	randomShow();
	function randomShow(){
		var elmLength = setElm.length,
		randomSet = Math.floor(Math.random()*elmLength);

		$(setElm[randomSet]).animate({'bottom':'-118px'},300,'easeOutCubic').animate({'bottom':'-111px'},150,'easeOutCubic').animate({'bottom':'-115px'},100,'easeOutCubic');
		setElm.splice(randomSet,1);

		if (elmLength > 0) {
			setTimeout(function(){randomShow();},delaySpeed);
		} else {
			return false; //全てロード終了後に処理を加える際はココに
		}
	}
});