Sticky
기본 레이아웃
| 옵션 | 설명 |
|---|---|
| data-container | 사용자 정의가 가능한 컨테이너 템플릿(자세한 내용은 foundation문서 참조.) |
| data-stick-to | sticky요소가 따라다니는 위치 ("top": 상단 / "bottom": 하단) |
| data-anchor | sticky요소의 움직임 범위 (예: body요소의 아이디(id)값 지정 후 설정시 그 범위만 움직임) |
| data-top-anchor | sticky요소의 움직임 정지 시작점 (아이디(id)값의 위쪽을 기준점으로 할 경우 : id:top / 아래쪽을 기준점으로 할 경우 id:bottom) |
| data-btm-anchor | sticky요소의 움직임 정지 끝점 (아이디(id)값의 위쪽을 기준점으로 할 경우 : id:top / 아래쪽을 기준점으로 할 경우 id:bottom) |
| data-margin-top | sticky요소의 상단 margin(여백)값 (기본값은 "1" / 여백이 필요 없을 경우 "0"으로 설정) |
| data-margin-bottom | sticky요소의 하단 margin(여백)값 (기본값은 "1" / 여백이 필요 없을 경우 "0"으로 설정) |
| data-sticky-on | sticky요소가 작동하는 크기 (small:모바일 / medium:테블릿 / large:데스크탑) |
| data-sticky-class | 자식 클래스(sticky)를 다른 클래스로 적용시 선언 |
| data-container-class | 부모 클래스(sticky-container)를 다른 클래스로 적용시 선언 |
| data-dynamic-height | sticky요소의 높이(height)값을 로딩 또는 브라우저의 크기에 따라 재정의 (true: 기본값 / false: 기능 끔) |
| data-check-every | sticky요소의 시작점을 로딩 또는 브라우저의 크기에 따라 재정의(자세한 내용은 foundation문서 참조.) |