1) draggable
- 드래그 기능으로 내가 원하는 위치에 가져다 놓고 싶을때 사용
- 예를 들어 게임미니맵위치가 오른쪽 하단에 있는데 왼쪽 미니맵 하단으로 옮기고 싶을때 사용
1. draggable 예제
|
<head> <script src="https://code.jquery.com/jquery-1.12.4.js"></script> <script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js"></script>
<script> // draggable 사용 $(function() { $( "#test" ).draggable(); }); </script> </head>
<body> <div id="test"> //움직일 대상 내용 </div> </body>
|
- draggable 취소
| $( "#test" ).draggable( "option", "disabled", true ); |
2) sortable
- sortable 은 정렬된 목차 순서를 변경을 하고싶을때 사용
1. sortble 예제
|
<script> //sortble 사용 $(function() { $("#test2").sortble(); });
</script>
<body>
<ui id="test2"> <li>첫번째</li> <li>두번째</li> <li>세번째</li> <li>네번째</li> </ui>
</body> |
| 첫번째 |
| 두번째 |
| 세번째 |
| 네번째 |
- 이렇게 sortble 기능을 사용하면 첫번째에 마우스 커서를 대고 두번째로 드래그 했을시 첫번째와 두번째 순서가
바뀌어버립니다.
'JQuery' 카테고리의 다른 글
| [JQuery] 제이쿼리란??(초보자들이 알기쉽게) (0) | 2020.02.14 |
|---|