저작권 안내
이 템플릿은 실제 서비스 예시를 위해 티스토리에서 사용했던 이미지 요소를 그대로 구현했습니다. 해당 요소의 이미지는 저작권법에 보호받고 있으므로 반드시 교체하십시오.
템플릿에 대해
응용 예시에서 구현한 티스토리 요소는 본래 티스토리 웹사이트에서는 모바일 구성이 없지만 이 템플릿에서는 별도로 구현하였습니다.
핵심 레이어
레이어에 🚀
이모지가 있는 레이어를 복사해서 원하는 페이지에 붙여 넣습니다.
스크롤 트리거 요소 켜기 / 끄기
템플릿에서는 트리거가 어디에 위치했는지 알 수 있도록 보라색 글씨로 나타납니다. 트리거를 보이지 않게 하려면 CSS Classes
필드의 jetcraft-trigger
클래스 옆에 off
클래스를 추가합니다.
모바일 기기에서의 양쪽 여백 처리
템플릿의 응용 1
과 응용 2
예제는 모바일 기기 상태일 때 양쪽에 24px
씩의 음수 마진이 설정되어 있습니다. 이 수치는 사용자가 운영하는 사이트의 모바일 상태의 양쪽 여백에 따라 조정합니다.
음수 마진이 필요없는 경우 아래의 레이어에서 width
값인 auto
를 삭제하고, Advanced
탭의 margin
값을 모두 지우거나 0
으로 설정하세요.
- 🚀 jetcraft-section-scrollTrigger-01-b
- 🚀 jetcraft-section-scrollTrigger-01-c
커스터마이징
Jetcraft 블로그에서 스크롤 트리거에 대해 자세히 다루고 있습니다. 해당 기사는 이 템플릿을 기반으로 작성되었으므로 커스터마이징이 필요한 분은 블로그 기사를 참조하시기 바랍니다.