我有3个div,我正在使用JQuery Sortable Plugin。它工作正常,但问题是我在第一个Div的右下角放置了另一个小div(黑色)我想要的是当我拖动第一个div时,小div也拖着它。 这是代码,
HTML
<!DOCTYPE html>
<html lang="eng">
<head>
<title>Drag 2 divs same time</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" ></script>
<link rel="stylesheet" type="text/css" src="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" ></script>
<script src="http://code.jquery.com/jquery-1.9.1.js" ></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js" ></script>
<link rel="stylesheet" type="text/css" href="css.css">
</head>
<body>
<div id="wrapper">
<div id="div1" > Div 1</div>
<div id= "small"></div>
<div id="div2" > Div 2</div>
<div id="div3" > Div 3</div>
</div>
<script>
$('#wrapper').sortable({ cancel: "#small"});
$('#wrapper').disableSelection();
</script>
</body>
</html>
CSS
#div2{
width: 100px;
height: 100px;
background-color: red;
float: left;
margin-left: 5px;
}
#div1{
width: 100px;
height: 100px;
background-color: red;
float: left;
margin-left: 5px;
}
#div3{
width: 100px;
height: 100px;
background-color: red;
float: left;
margin-left: 5px;
}
#small{
width:25px;
height: 25px;
background-color: black;
position: absolute;
left: 88px;
top: 83px;
}
答案 0 :(得分:0)
尝试将小div放在实际的div中:
<div id="wrapper">
<div id="div1" > Div 1
<div id= "small"></div>
</div>
<div id="div2" > Div 2</div>
<div id="div3" > Div 3</div>
</div>