yuheijotaki.com

スクロールしたら下から表示

function scroll_animation() {
	var window_scroll = $(window).scrollTop();
	var window_height = $(window).innerHeight();
	var window_bottom = window_scroll + window_height;
	$('.box').each(function(){
		var box_position = $(this).attr('data-top');
		if ( window_bottom > box_position ) {
			var rand_delay = Math.floor( Math.random() * 500 ) + 100;
			$(this).delay(rand_delay).animate({'opacity':'1','top':'0'}, 750, 'easeOutQuart');
		}
	});
}

$(function(){
	$('.box').each(function(){
		var default_pos = $(this).offset().top;
		$(this).attr('data-top',default_pos);
		var random_top = Math.floor( Math.random() * 500 ) + 250 ;
		$(this).css({'top':random_top+'px'});
	});
	scroll_animation();
	$(window).scroll(function () {
		scroll_animation();
	});
});