Почему «fly-animation» не применяется к первым двум блокам.

Question

.

. Я создал небольшой скрипт для перемещения некоторых элементов (например, эффект «влета») с правой и левой сторон при прокрутке http://codepen.io/anon/pen/jPPKxX. Также я хотел применить этот эффект для элементов непосредственно после загрузки страницы (перед любой прокруткой). Но в результате первые 2 элемента, которые я вижу, появляются в центре страницы, но не с правой или с левой стороны. Может ли кто-нибудь объяснить мне, в чем проблема? Заранее спасибо! Это часть JS кода:

var FlyInBlocks = { 
    anim: function(_element) { 
    var elDirect = $(_element).data("direction"), 
     winScrollTop = $(window).scrollTop(), 
     winHeight = $(window).height(), 
     winWidth = $(window).width(), 
     elPos = $(_element).offset().top, 
     resHeight = elPos - winHeight; 
    $(_element).css(elDirect, -winWidth + "px"); 

    if (winScrollTop >= resHeight) { 
     $(_element).addClass("b-fly-visible").css(elDirect, "0"); 
    } 
    } 
}; 

$(document).ready(function() { 

    $(".block").each(function() { 
    FlyInBlocks.anim(this); 
    }); 

    $(window).scroll(function() { 
    $(".block").each(function() { 
     FlyInBlocks.anim(this); 
    }); 
    }); 

}); 

Answer 1

Из ваших codepen связать его не показывает анимацию нагрузки, ни на свитке. Если вы добавите верхнюю часть поля в верхнюю область, она начнет отображаться в списке прокрутки. Я думаю, что вы должны изменить эту часть:

if (winScrollTop >= resHeight) { 
    $(_element).addClass("b-fly-visible").css(elDirect, "0"); 
} 

Всегда запускать его на первую итерацию, и только после этого проверок на (winScrollTop> = resHeight), потому что он никогда не будет добавить класс «б лета видимые ', если элемент начинается сверху.