해당 페이지에 접속했을 때 애니메이션 실행하기

Question

상단메뉴

HOME
PROJECT
ABOUT US
NEWS
REQUEST

메인

Communication

$(function () { $('#fullpage').fullpage({ //options here navigation: true, navigationPosition: 'right', autoScrolling: true, scrollHorizontally: true, anchors: ['anchor1', 'anchor2', 'anchor3', 'anchor4', 'anchor5', 'anchor6'], afterSlideLoad: function (anchorLink, index, slideAnchor, slideIndex) { $('.anchor.active').removeClass('active'); $('.anchor').eq(slideIndex).addClass('active'); } }); $('.regular').slick({ infinite: true, slidesToShow: 3, slidesToScroll: 3, prevArrow: '', nextArrow: '' }); }); https://animate.style/ 와(앞 animate__는 지웠습니다) https://alvarotrigo.com/fullPage/ko/ 를 쓰고 있습니다. 풀페이지 스크롤이고, section마다 한 페이지씩이라고 생각하시면 됩니다.코드와 같이 section1에 있는 건 바로 실행이 잘 되지만... section 2부터 안에 있는 tit_img_box를 FadeIn 시키고 싶은데 페이지 로딩 될 때 같이 적용이 되어버리더라고요. 어떻게 해야 2페이지, 3페이지에 들어왔을 때 해당하는 애니메이션을 적용시킬 수 있을까요??????

시릇 · Answer

FadeIn 시키는 css 클래스를 만들어서addClass('active'); 를 적용할 때, 같이 addClass 해보시는건 어떨까요?해당 section이 완전히 실행될 때 적용되도록 setTimeout 으로 딜레이를 주거나하면 좋을 것 같습니다. 여러 방법중 단순한 방법인 것 같네요

kenu,전독시 · Answer

해당 게시물은 관리자에 의해 Blockchain Q&A에서 Tech Q&A로 이동 되었습니다.

해당 페이지에 접속했을 때 애니메이션 실행하기

2개의 답변

#fullpage 목록