Question

让克隆既可拖动又可调整大小有点麻烦：

这段代码使得克隆可以拖动（addClass与程序中的其他内容相关。）

if(ui.draggable[0].id){
$(this)
.append($(ui.helper).clone().draggable().addClass("resize"));

我尝试了以下操作，但随后克隆在删除时消失：

if(ui.draggable[0].id){
$(this)
.append($(ui.helper).clone().draggable().resizable().addClass("resize"));

这是我的测试页面。尝试拖动其中一个字符。一旦进入漫画，他们就可以调整大小。我也尝试使用addclass使它们在drop之后可以调整大小，然后调用一些jquery来使该类的所有项目可以调整大小，并且只要调整大小，但拖动停止工作（它看起来很笨重）：

http://www.thelionscall.com/wp-content/comic-creator/

Answer 1

这结果是一个非常棘手的问题......

但是，我来到某个地方。想看看吗？

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Test Document</title>
  <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css">
  <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>
  <style>
    #mainImg {
        position: absolute !important;
    }
  </style>
</head>
<body>
    <script>
    $(document).ready(function() {
        $("#mainImg").draggable();
        $("#mainImg").on('dragstop', function(event) { 
            event.preventDefault();
            $(this).resizable();
            $(this).draggable();
        });
    });
    </script>
    <div class="container">
        <img style="width: 700px;" src="test.png" id="mainImg" class="ui-widget-content" alt="Test Image">
    </div>
</body>
</html>

使用jquery-ui对克隆进行大小调整后拖动它

1 个答案: