Slider의 Content parallax 처음부터 애니메이션 작동되게 하는 법이 궁금해요

Question

총 3장의 이미지를 넣어서 parallax 로 h2는 위에서 아래로 텍스트가 내려오고 p는 아래에서 위로 텍스트가 올라오는 효과를 넣은 슬라이드를 만들었는데요 이 효과가 맨 처음 화면 뜬 상황에서는 작동이 안되고 꼭 한번 슬라이드가 실행된 후에야 작동이 되더라구요 처음 화면 떴을때부터 텍스트 애니메이션이 작동되게 하는 그런 방법이 궁금합니다. < div class = "uk-position-relative uk-visible-toggle uk-light " tabindex = "-1" uk-slideshow = "animation: fade; autoplay: true; autoplay-interval: 3000; " > < ul class = "myslide uk-slideshow-items uk-grid-match" uk-height-viewport = "min-height: 300" > < li > < img src = "images/image01.jpg" uk-cover > < div class = "uk-position-center uk-position-small uk-text-center" > < h2 uk-slideshow-parallax = "y: -150,0,0; opacity: 1,1,0" > Heading < p uk-slideshow-parallax = "y: 100,0,0; opacity: 1,1,0" > Lorem ipsum dolor sit amet. < li > < img src = "images/image02.jpg" uk-cover > < div class = "uk-position-center uk-position-small uk-text-center" > < h2 uk-slideshow-parallax = "y: -150,0,0; opacity: 1,1,0" > Heading < p uk-slideshow-parallax = "y: 100,0,0; opacity: 1,1,0" > Lorem ipsum dolor sit amet. < li > < img src = "images/image03.jpg" uk-cover > < div class = "uk-position-center uk-position-small uk-text-center" > < h2 uk-slideshow-parallax = "y: -150,0,0; opacity: 1,1,0" > Heading < p uk-slideshow-parallax = "y: 100,0,0; opacity: 1,1,0" > Lorem ipsum dolor sit amet. < a class = "uk-position-center-left uk-position-small uk-hidden-hover" href = "#" uk-slidenav-previous uk-slideshow-item = "previous" > < a class = "uk-position-center-right uk-position-small uk-hidden-hover" href = "#" uk-slidenav-next uk-slideshow-item = "next" >

codingworks · Answer

개인적인 일로 답변이 늦었습니다. 양해 바랍니다. uikit에서 parallax 부분은 강의에 넣지 않은건 저도 쉽게 이해가 안되는 부분이 있었고 이걸 강의로 담기가 좀 어렵다는 생각 때문이었어요. 저도 사용할 때 기본적인 html 가지고와서 수정하는 방식으로 하거든요. 혹시 지금 부분이 중요하게 반드시 해결해야 하는 부분이라면 코드를 복사해서 올려주세요. 캡쳐 코드로는 에디터에 넣어서 볼 수가 없어서요.