Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
    <script>
    $(document).ready(function(){
      
        $('.test').draggable({
           zIndex:3000,
           appendTo:'body',
           helper: "clone",
           start: function (e, u) {
           },
           stop: function () {
             
           }}).click(function(){
          var b=parseInt($(this.width));
        $(this).css('width',b+5)
        })
    
    
        $('#drop').droppable({
          accept: ".test",
          drop:function(e,u){
        var a=u.helper.clone();
            console.log(a)
              $(this).append(a);
            $(a).attr('class','dropped').draggable();
          }  })
               
       
        })
    </script>
</head>
<body>
<div class="test" style="width:50px;height:50px;background-color:red" ></div>
<div id="drop" style="width:200px;height:200px;background-color:green"     ></div>
</body>
</html>
Output

You can jump to the latest bin by adding /latest to your URL

Dismiss x
public
Bin info
anonymouspro
0viewers