jQuery fadeInDiv() 및 Flexbox

Question

내 workitem이 페이드 인되면 시작 위치가 가운데에오고 새 위치가 표시되면 왼쪽으로 이동합니다. 나는 움직이지 않고 왼쪽에서 오른쪽으로 있어야한다고 생각합니다.

$('.workitem').each(function(fadeInDiv){ 
 
    $(this).delay(fadeInDiv *1500).fadeIn(5000); 
 
});

#work { 
 
    justify-content:center; 
 
    align-items:flex-start; 
 
    width:70%; 
 
    height:70%; 
 
    background-color:black; 
 
    display:flex; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div id="work"> 
 
    <div class="workitem"></div> 
 
    <div class="workitem"></div> 
 
    <div class="workitem"></div> 
 
    <div class="workitem"></div> 
 
</div>

Answer 1

fadeIn를 사용하여()는 필요하시면하지 않은, 요소의 표시를 설정합니다. 당신은 그 항목을 숨기지 않고 그대로두고 싶습니다.

$('.workitem').css("opacity","0").each(function(fadeInDiv){ 

$(this).delay(fadeInDiv*1500).fadeTo("slow", 1); 

}); 

bootply 예 : https://www.bootply.com/v9AtAQmDRR

그래서 당신은 요소의 불투명도 아마 뭔가 같은 영향을 미치는 fadeTo() 사용을 고려할 수