다른 div 안에 드래그 가능한 div 만들기

더 큰 div 안에있는 드래그 가능한 div를 만들고 싶습니다. 이것은 내 프로그램입니다. 하지만 작동하지 않습니다. draggable 함수를 사용하여 div를 드래그 할 수있게 만드는 것 같습니다. 또한 어떤 버전을 사용해야합니까? 1.7.2 또는 1.3.2?다른 div 안에 드래그 가능한 div 만들기

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 

    <head> 
     <title>First jQuery-Enabled Page</title> 
     <style type="text/css"> 
      #draggable { 
       background-color:blue; 
       width: 150px; 
       height: 150px; 
       padding: 0.5em; 
      } 
     </style> 
     <script type="text/javascript" src="jquery-ui-1.8.21.custom.min"></script> 
     <script type="text/javascript"> 
      $(function() { 

       $("#draggable").draggable(); 
      }); 
     </script> 
    </head> 

    <body> 
     <div id="draggable"> 
      <p>hai</p> 
     </div> 
    </body> 

</html>

출처

2012-07-20 Bhavin Bhaskaran

자바 스크립트는 다음과 같이 설정해야합니다. http://jsfiddle.net/mUa3r/

는 본질적으로 드래그하고 컨테이너에 구속 당신의 상자를 가지고, {containment: parent}을 사용할 때, : 나는 당신의 코드를 수정하고 여기에 작업 예제를 생산하기 위해 노력했습니다

출처

2012-07-20 06:45:00 mithilatw

'$ (document) .ready (function) '와 동일합니다 – Musa

<script type="text/javascript"> 

    $(document).ready(function() { 

     $("#draggable").draggable(); 

    }); 

</script>

희망이 도움이 here을 설명했다.

업데이트 : (링크가 당신을 위해 작동하지 않는부터)

스크립트 :

<script> 
      $(function() { 
      $("#draggable").draggable({containment: "parent" }); 
    }); 
    </script>

HTML :

<div id="container"> 
      <div id="draggable"> 
        <p>hai</p> 
      </div> 
    </div>

CSS :

#container {background-color:grey; width: 300px; height: 300px;} 
    #draggable {background-color:blue; width: 150px; height: 150px; padding: 0.5em;}

희망이 있습니다.

출처

2012-07-20 06:49:34

여기에 코드를 넣을 수 있습니까? 주어진 링크에서 코드를 볼 수 없습니다. –

다른 div 안에 드래그 가능한 div 만들기

답변

관련 문제