네비게이션 활성화 여부 및 아이콘 설정

슬라이더의 네비게이션이 보일지 결정하고 화살표 모양에 해당하는 이미지를 변경할 수 있습니다. png 파일로 투명하게 등록하시는게 좋겠죠?

페이지네이션 설정

슬라이더의 페이지네이션 타입을 정의합니다. 불릿, 숫자, 프로그래스 바 세가지 옵션을 지원하며 페이지네이션을 활성 / 비활성화 할 수 있습니다. 작은 옵션으로 페이지네이션의 불릿, 숫자 등을 클릭하면 화면을 이동할지 결정하는 토글 기능도 있습니다.

슬라이더 요소 간격, 화면에 보일 개수 설정

슬라이더의 화면 개수가 1개라면 상관 없겠지만 여러개를 한 화면에 담으면 그 사이에 여백이 중요해집니다. 이 옵션은 여러개의 화면이 동시에 슬라이딩 되는 화면 전환의 경우에 사용하시면 좋습니다. 흔히를 볼 수 있는 이미지가 두개씩 슬라이딩 되는 그런 효과입니다.

브레이크 포인 설정 ( 전문가용 )

이 기능은 개발에 지식이 있으신 분들만 사용하시는것을 권장합니다. 슬라이더가 화면의 크기에 따라 다르게 보여질 수 있도록 설정하는 기능입니다. JSON 타입으로 작성해야 하며, 간단한 예시를 아래에 남깁니다.

Example: {“720”:{“slidesPerView”:2}} – Notice the double quotes

슬라이더 자동 높이 설정

슬라이더의 높이가 다를 경우 화면이 전환될 때 자동으로 높이를 변환합니다. 기본값은 활성화 상태이며 대부분의 상황에 이 설정이 효과적일 것 입니다.

슬라이더 방향 설정

슬라이더의 방향을 결정합니다. 단, 슬라이더의 화면 전환 방식이 움직임이 있는 경우에만 효과가 적용됩니다. 예를 들어 Fade 의 경우 방향은 큰 의미가 없어집니다.

슬라이더 핵심 기능 설정 ( 기본 )

Auto Play ) 슬라이더가 자동으로 넘어가는 기능을 활성화 합니다.

Disable On Interaction ) Auto Play 를 설정했다면 화면이 자동으로 넘어가게 되는데, 사용자 인터렉션 ( 화면을 마우스로 넘겼거나 불릿을 선택해서 화면을 전환한 경우 ) 있다면 슬라이더 화면 전환을 멈추는 기능입니다. 화면이 빨리 넘어가면 정신 없을 수 있겠죠? 이 기능으로 해결할 수 있습니다.

Loop ) 슬라이더 요소의 끝 지점을 설정하는 기능입니다. 예를 들어 1 | 2 | 3 이라는 화면 전환이 있다면, 이 기능일 활성화 하면 1 | 2 | 3 | 1 | 2 | 3 | 이렇게 순차적으로 무한히 화면이 반복 전환 됩니다. 만약 비활성화 하면 3번째 화면에서는 더이상 다음 화면으로 이동할 수 없고 돌아가는 선택을 해야 합니다.

Delay ) 화면이 전환될 때 마다 멈추는 시간입니다. ( ms 단위 )

Speed ) 화면이 전환되는 속도를 의미합니다. ( ms 단위 )

Effect ) 화면이 전환되는 스타일을 결정합니다.