혹시 부드럽게 진입 이후 루프가 가능할까요?
안녕하세요!
초기 애니메이션을 진입할때 css나 gsap으로 keyfream 주고
빠르게 들어온 이후 감속하듯이 부드럽게 흐르도록 구현 할 수 있을까요..?
css에 같은 클래스에 키프레임을 줬더니 css때문에 gsap이 충돌나는지 안되더라구요.ㅠ.
Câu trả lời 1
1
안녕하세요 squirrel PARK 님 😀
Q. 최초 렌더링시 애니메이션이 빠르게 들어온 이후 감속하는 모션은 어떻게 구현할 수 있을까요 ?
A. GSAP의 가속도를 조절해 해당 애니메이션을 구현할 수 있습니다. 제가 주로 사용하는 가속도는 Power3.inOut 효과를 많이 사용합니다.
원하는 가속도의 모습을 해당 사이트 에서 직접 확인해보고 적용해보세요
GSAP 사용시 주의사항
- 동일한 엘리먼트에게 css 애니메이션(keyframes, transition)과 gsap 애니메이션을 동시에 주지마세요!
gsap은 자바스크립트로 속성 하나씩을 애니메이션 처리 하기 때문에 css의 애니메이션이 걸려 있을 경우 버벅 거리는 문제가 생길 수 있습니다. 꼭 이렇게 줘야 하는 상황이 생긴다면, html 설계를 고려해보시고, 상위 부모에게 css를 하위 자식에게 gsap 애니메이션을 넣어 처리하는 방식을 고려해보세요
감사합니다 :)
1
아.. 같은 div에 css랑 gsap하면 충돌나는군여!
차선책으로 부모 div에 css로 Keyfream 주고 자식에 gsap 효과주는 방법도있겠네요! 감사합니다
존재하지 않는 일기 url입력 시 alert이 두 번 떠요
0
17
1
useState 직접 구현 부분에서 질문이 있습니다.
1
22
1
학습을 하고 블로그에 정리를 해도 괜찮을까요?
1
26
1
교재(3쇄)와 강의 내용 문의
0
28
2
섹션2번 부분 강의 화면이 잘 못된것 같아서 문의합니다.
0
23
1
call stack 표현이 잘못표현된것이 아닌가요?
0
65
2
part3. spy 쪽 / part3,part4 강의자료
0
32
2
최종 코드
0
40
2
hover pulse animation 관련해서 질문있습니다!
0
78
2
어몽이를 stage의 100% 로 보낼 수 있는 방법이 궁금해요!
1
90
2
autoAlpha : 0 사용 시 css로 visibility hidden 꼭 줘야하는지 궁금해요
1
238
2
gsap으로 흐르는 배너도 제작이 가능할까요?
1
485
2
다중요소 제어시 질문드립니다.
1
262
2
timeline를 호출한 함수를 변수에 할당할때, const/let 둘 중에 어떤 것으로 해야 하나요?
1
481
1
gsap 상업적 사용여부
1
1036
1
fork 주소가 어떻게 되나요?
1
466
1
강사님 다중요소제어 stagger 질문있습니다
2
462
1
노션 주소 좀 확인해주세요. 잘못되어 있는 것 같아요. 아무것도 클릭이 안됩니다.
1
724
1
autoAlpha를 사용한다고 해도 성능상의 이점은 없는거 아닌가요?
1
559
1
기초 트위닝 질문
1
382
1
선생님 Advanced 강의가 절실합니다.
1
477
1
어몽이가 안나와요!! 저만 그럴까요?
1
520
2
추후에 반응형에 관련된 강의 내용도 포함될까욥,,?
1
749
1
❗️긴급❗️ 선생님 실습파일이 잘못된것 같습니다.
1
557
1