드래그 드랍 지정하기 - draggable(), droppable()
1. 정의
- DIV 요소에 드랍, 드래그를 할 수 있도록 지정
2. 문법
- $('드래그 요소').draggable({매개변수: 값..})
- $('드랍요소').droppable({매개변수: 값..})
3. 매개변수
1) draggable
a. 기본
- cusor : 드래그 중인커서
- oppacity : 투명도
- scroll : 드래그 조작중 스크롤
- handler : 드래그 핸들
- helper : 드래그 중의 표시
....
b. 제한
- axis : 드래그 가능한 방향
- cancel : 선택 할 수 없는 요소
...
c. 리스너
- start : 드래그 시작 시
- drag : 드래그 시 호출
- stop : 드래그 종료시
2) droppable
a. 기본
- accept : 드롭 할 수 있는 요소
- aciveClass, hoverClass
...
b. 리스너
- activate : 드래그 시작시
- over : 드래그 요소가 영역으로 올때
- out : 요소 나갈 때
- drop : 드롭 시
4. 예제
'Front-End > jQueryUI' 카테고리의 다른 글
| [jQueryUI] jQueryUI 이용 방법 (0) | 2017.01.16 |
|---|---|
| [jQueryUI] 드랍 요소 제어하기 - droppable[accept, scope] (0) | 2017.01.12 |
| [jQueryUI] 드래그로 여러항목 선택 - selectable() (0) | 2017.01.12 |
| [jQueryUI] 드래그 드랍으로 정렬시 드랍 위치 표시 - sortable()[placeholder] (0) | 2017.01.12 |
| [jQueryUI] 드래그 드랍 정렬요소 제한하기 - sortable()[items, cancel] (0) | 2017.01.12 |
리딩리드