jquery拖放克隆具有可调整大小和可旋转 [英] jquery drag drop clone with resizable and rotatable
问题描述
你好
我正在做一个项目，因为我需要将图像从下拉列表拖到容器中，然后放入div应该选择图像，同时它必须显示锚点以供重新使用相当大，可以旋转。
我已经完成了拖动，丢弃和克隆图像（因为图像从容器中出来，不知道为什么还在处理它）如果我们使用它就可以了没有下拉'但我不知道如何显示可重复大小，可旋转和可选择的锚。我搜索了示例代码无法找到任何相关的解决方案。任何人都可以帮助我。
在此先感谢任何帮助将不胜感激。
以下是拖放和克隆的代码
Hello
I am doing a project in that I need drag images from drop down list to container after dropping on to div the image should be selected at the same time it have to show anchors for re sizable and rotatable.
I have done till drag,drop and clone of images (in that the image is going out of container don''t known why still working on it)it is working if we use without drop down''s but i don''t know how to show anchors for re sizable,rotatable and selectable.I have searched for sample code couldn''t find any relevant solution.Can anyone help me on this.
Thanks in advance any help would be appreciated.
The below is the code for drag,drop and clone
<pre> <head>
<style type="text/css">
.drag
{
}
.drop-zone
{
border: 1px solid #9C9898;
height: 350px;
width: 400px;
margin: 0px;
margin-top: 80px;
}
</style>
</head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function () {
$(''.drop-zone'').droppable({
accept: ''.drag'',
drop: function (event, ui) {
var $clone = ui.helper.clone();
if (!$clone.is(''.inside-drop-zone'')) {
$(this).append($clone.addClass(''inside-drop-zone'').draggable({
containment: ''.drop-zone''
}));
}
}
});
$(''.drag'').draggable({
helper: ''clone''
});
});
</script>
<body>
<div id="right" style="float: right;">
<img alt="" src="../../Content/themes/base/images/Design3.png " class="drag" /><br />
<img alt="" src="../../Content/themes/base/images/Design15.png" class="drag" /><br />
</div>
<div id="drop-zone" class="drop-zone">
</div>
推荐答案
（文件）.ready（function（）{
(document).ready(function () {
（''。drop-zone''）。droppable（{
accept：''。drag''，
drop：function（event，ui）{
var
(''.drop-zone'').droppable({ accept: ''.drag'', drop: function (event, ui) { var
clone = ui.helper.clone（）;
if（！
clone = ui.helper.clone(); if (!
这篇关于jquery拖放克隆具有可调整大小和可旋转的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
