Question

我在角度项目中使用jQueryUI resize选项。我将resize应用于img-preview-data，将句柄应用为sw, se。现在从se调整大小是完美的，它不会超出边界。

但是当我尝试从sw调整大小并停在某个特定位置时，我只能将其调整得更小，并且无法将其调整得更大。

请帮助找到解决方案

＆＃13;

$(document).ready(function() {
  $("#img-preview-data").resizable({
    autoHide: false,
    aspectRatio: true,
    handles: "se, sw",
    containment: "parent"
  });
});

＆＃13;

<div id="img-main-container" class="ng-scope" style="height: 78px; width: 720px;border:1px solid #ccc">
  <div id="img-container" style="position:absolute; display:block; height: 76px; width: 718px;">
    <div id="img-preview-data" class="alignRight" style="width: 85px; height: 76px; max-height: 100%; max-width: 100%; overflow: hidden;">
      <img src="someURL" style="width:100%;height:100%">
    </div>
    <canvas id="resize-canvas" width="83" height="76"></canvas>
  </div>

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.11.2/jquery-ui.min.js"></script>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.11.2/themes/black-tie/jquery-ui.css" />
<div id="img-main-container" class="ng-scope" style="height: 78px; width: 720px;border:1px solid #ccc">
  <div id="img-container" style="position:absolute; display:block; height: 76px; width: 718px;">
    <div id="img-preview-data" class="alignRight" style="width: 85px; height: 76px; max-height: 100%; max-width: 100%; overflow: hidden;">
      <img src="someURL" style="width:100%;height:100%">
    </div>
    <canvas id="resize-canvas" width="83" height="76"></canvas>
  </div>

＆＃13;

修复JQUERY UI调整右对齐元素的大小

0 个答案: