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(); }); });
2016/06/03 :
スクロールしたら下から表示
Category : Develop