[JQuery] DIV 가로 세로 순서 이동, sortable

JQuery DIV 가로 세로 순서 이동, sortable

---

■ CSS

#sortWrap {
	padding: 10px;
}
#sortWrap div {
	margin: 10px;
	padding: 10px 0 10px 20px;
	background-color: #FFF;
	border: 1px solid #ddd;
	cursor: move;
}

■ HTML

<div id="sortWrap">
	<div data-order=1 data-code=‘number1’>1</div>
	<div data-order=2 data-code=‘number2’>2</div>
	<div data-order=3 data-code=‘number3’>3</div>
	<div data-order=4 data-code=‘number4'>4</div>
	<div data-order=5 data-code=‘number5’>5</div>
</div>

■ Javascript

$("#sortWrap").sortable({
	axis: "y",	// 가로 이동 시 x 로 변경
	containment: "parent",
	update: function (event, ui) {
		var order = $(this).sortable('toArray', {
			attribute: 'data-order'
		});
		console.log(order);
	}
});