Skip welcome & menu and move to editor
Welcome to JS Bin
Load cached copy from
 
<!DOCTYPE html>
<html>
<head>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/themes/smoothness/jquery-ui.min.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.3/jquery-ui.min.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
  <ul id="ke" class="connectedSortable">
    <li>kệ 1</li>
    <li>kệ 2</li>
    <li>kệ 2</li>
    <li>kệ 2</li>
    <li>kệ 2</li>
  </ul>
  <ul id="tu" class="connectedSortable">
  </ul>
</body>
</html>
 
ul { 
  border: 1px solid blue;
  min-height: 20px;
}
ul li{
  height: 50px
}
ul#tu{
  max-height: 100px;
}
 
$('#tu').sortable({
  connectWith: '.connectedSortable'
});
$('#ke li').draggable({
  helper: 'clone',
  connectToSortable: $('#tu')
})
Output

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

Dismiss x
public
Bin info
anonymouspro
0viewers