首页
学习
活动
专区
圈层
工具
发布
社区首页 >问答首页 >jqueryui可拖动问题:如何同时拖动多个元素?

jqueryui可拖动问题:如何同时拖动多个元素?
EN

Stack Overflow用户
提问于 2010-01-01 15:55:54
回答 1查看 3.3K关注 0票数 2

假设我设置了要拖动的内容:

代码语言:javascript
复制
<div class="container">
  <div id="draggable-1"></div>
  <div id="draggable-3"></div>
  <div id="draggable-4"></div>
  <div id="draggable-5"></div>
</div>

是否可以设置jqueryui的draggable api,让我可以同时拖动多个draggable元素?谢谢。

EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2010-01-01 19:24:26

这只是一个猜测,但请尝试一下

在容器上不设置样式表,以便将其设置为一个组。然后这样做

代码语言:javascript
复制
$(function() {

$(".container").draggable();

});

然后,当您拖动整个容器时,会将其作为一组进行拖动,包括其中的所有元素。

下面是我所做工作的一个工作示例。

代码语言:javascript
复制
<html>
<head>
<style type="text/css">

#draggable-1,#draggable-2,#draggable-3,#draggable-4,#draggable-5 {

width:100px;
height:100px;
background:red;
margin-bottom:10px;

}

.container {
}
</style>

<script type="text/javascript" src="http://jqueryui.com/latest/jquery-1.3.2.js"></script>
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.core.js"></script>
<script type="text/javascript" src="http://jqueryui.com/latest/ui/ui.draggable.js"></script>

<script type="text/javascript">

$(function() {

$(".container").draggable();

});


</script>
</head>
<body>

<div class="container">
  <div id="draggable-1"></div>
  <div id="draggable-3"></div>
  <div id="draggable-4"></div>
  <div id="draggable-5"></div>
</div>


</body>
</html>
票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/1988151

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档