목록📖 gsap (1)
즐겁게, 코드
삼성페이 티켓 페이지 인터렉션 구현하기
연휴를 녹이러 영화도 볼겸 체인소맨 극장판을 봤다. 특이했던 것이 요즘은 롯데시네마 앱에서 영화표를 예매하면 삼성페이에 자동으로 연동된다.뒷단 개발자들이 갈렸을 것 같은데... 간만에 프론트 개발자라 다행이라는 생각이 들었다.그런데 삼성페이를 써보던 중 페이지를 아래로 스크롤하면 티켓과 영화 제목이 자연스럽게 사라지는 애니메이션이 눈에 들어왔다.원래대로라면 티켓 정보를 보여주는 평범한 페이지라 느껴졌을 텐데, 이런 인터렉션을 넣으니 경험이 상당히 괜찮게 느껴져서 직접 만들어보고 싶었다.처음에는 scrub: true 정도만 사용하면 무난하게 만들 수 있을 것 같았는데, 추가로 고려해야 했던 점들이 몇 가지 있었다.최상단 티켓 이미지가 제자리를 유지한 채로 scale: 0에 도달할 수 있도록 pin: tru..
🧺 일상다반사
2025. 10. 8. 17:24
소소한 팁 : 광고를 눌러주시면, 제가 뮤지컬을 마음껏 보러다닐 수 있어요!
와!! 바로 눌러야겠네요! 😆