Почему первый блок медленно проявляется?

Question

[Araya]

$(window).scroll(function(){
        country.each(function(){
        var top = this.getBoundingClientRect().top;
        if(top < height){
        country.each(function(index) {
            $(this).delay(500 * index).animate({
                opacity: 1
            },1000);
        });
        }
    });
    });

Всем привет, есть идеи, почему первый блок проявляется дольше всех? Opacity скачет секунд 5.

Comments

[Павел Корнилов]

А если убрать
.delay(500 * index)
?

[Araya]

KorniloFF, если убрать delay, то все блоки появляются одновременно :с

[Павел Корнилов]

Тогда нужно дебонсить функцию в цикле.

[Павел Корнилов]

Тут вообще странная конструкция, которую сразу понять трудно.
Зачем делать вложенный цикл по тому же country? Лучше по выполнению условия делать рекурсию, к примеру. А так - несколько непредсказуемо, как себя animate поведёт...

[Araya]

KorniloFF, до этого было поле для экспериментов) но смысл от этого вроде как не меняется. Такую штуку делаю впервые, приму к сведению Ваш комментарий. Спасибо большое :)

[Araya]

KorniloFF, убрал цикл, все заработало, спасибо :)

[Павел Корнилов]

Araya, на здоровье!

[Islam Ibakaev]

используй, к примеру jquery.waypoints + animate.css для таких целей, не нужно извращений

[Araya]

Islam Ibakaev, обязательно гляну такой метод, спасибо!

[Islam Ibakaev]

Araya, или даже лучше, взять, например, aos и вместо встроенных анимации(если не нравятся) интегрировать animate.css(у них в readme.txt написано как это сделать). Я такое уже проворачивал - здесь

[Araya]

Islam Ibakaev, Выглядит очень круто, спасибо!)