2013-04-06 3 views
1

이 질문을하는 방법을 모르겠지만 최선을 다할 것입니다.div로 div를 드래그 앤 드롭

나는 웹 사이트를 코딩하고 있으며 PHP로 생성 된 div 목록이 있습니다. 옆에 다른 div가 있습니다. 아이디어는 목록의 div 중 하나를 다른 div로 드래그하면 목록의 div 클래스로 무언가를 할 수 있습니다.

목록에서 div를 하나의 HTML 코드

: 당신이에 놓으

<div style='width:100px' class='div1' draggable='true'> 
[content] 
</div> 

사업부의 HTML 코드 :

<div class="dropzone" ondrop="drop(event)" ondragover="allowDrop(event)" style="padding: 10px; border-width: 2px; border-style: dashed; width: 100px; height: 210px; float: right;"> 
[content] 
</div> 

생각은 당신이 끌어 "div1 "를"dropzone "으로 변경하면 dropzone은"div1 "을 변수로 사용하여 javascript 함수를 실행합니다. 자바 스크립트에서이를 수행 할 방법이 있습니까?

감사합니다.

+0

체크 아웃 [JQuery와 UI 낙하 할 (http://jqueryui.com/droppable/) – Class

+0

당신 2 개의 이벤트, mouseup 및 mousedown 이벤트를 볼 수 있습니다. draggable div를 이동하려면 자바 스크립트를 작성하거나 외부 코드 (일반적으로 jQuery와 같은 주요 자바 스크립트 라이브러리 용 플러그인 형식)를 사용해야합니다. 기본 아이디어는 mousedown, mousemove 및 mouseup 이벤트를 사용하여 마우스가 시작된 위치, 이동 후 위치 및 종료 위치를 추적 한 다음 그에 따라 클릭 된 개체를 적절히 이동하는 것입니다. – mowwwalker

답변