플로팅 플레이어
플레이어를 화면 모서리에 고정된 작은 창으로 띄우는 기능입니다. 처음부터 띄우거나 상품 클릭 시점에 전환하는 두 가지 시작 방식이 있습니다.
두 가지 시작 방식
플로팅은 setFloatingType 을 언제 호출하느냐로 갈립니다.
| 시작 방식 | 호출 시점 | 화면 |
|---|---|---|
| 기본 플로팅 | load 전 | 페이지를 열자마자 작은 창 |
| 상품 페이지 연동 플로팅 | 상품 클릭 브릿지 이벤트 안 | 전체 화면으로 보다가 상품 클릭 시 작은 창으로 축소 |
구성 단계
1단계만으로 플로팅이 동작합니다. 2~3단계는 필요할 때 더합니다.
| 단계 | 내용 | 필수 |
|---|---|---|
| 1 | setFloatingType({ type: 'basic' }) | 필수 |
| 2 | size · floatingPosition · restrictionArea 로 크기·위치·이동 범위 지정 | 선택 |
| 3 | setFloatingProductLinkUrl 로 뒤에 띄울 상품 페이지 지정 | 선택 |
기본 모양
옵션을 주지 않았을 때의 값입니다.
| 항목 | 기본값 |
|---|---|
| 크기 배율 | 0.25 |
| 위치 | 오른쪽 아래, 화면 가장자리에서 20px |
| 비율 | 9:16 세로 |
| 모서리 | 둥글기 20px |
| 겹침 순서 | z-index: 9999 |
| 드래그 | 가능. 화면 가장자리 100px 안에서 놓으면 가장자리에 붙음 |
가이드
Updated about 4 hours ago
Did this page help you?