Question

我正在使用jQuery UI来使图像像这样重新调整

.resizable({
      handles: 's,e,se'
});

我希望se句柄保持宽高比，而不是另一个。

我试过这样：

   .resizable({
          handles: 's,e'
    }).resizable({
          handles: 'se',
          aspectRatio:true
    });

但它不起作用......和想法？

由于

Answer 1

已解决：在使用角落调整大小时保持纵横比，但不是侧面

[html]

<div class="ResizableDiv"></div>

[javascript]

jDiv = $('.ResizableDiv');

jDiv.resizable({                    
    handles: "n, e, s, w, nw, ne, sw,se",
    start: function( event, ui ) {                          
        if ($(event.originalEvent.target).attr('class').match(/\b(ui-resizable-se|ui-resizable-sw|ui-resizable-ne|ui-resizable-nw)\b/)){
            // Keep aspect ratio when resizing using the corners
            jDiv.resizable( "option", "aspectRatio", true ).data('uiResizable')._aspectRatio = true;
        }       
    },  
    stop: function( event, ui ) {   
        // remove aspect ratio resize
        jDiv.resizable( "option", "aspectRatio", false ).data('uiResizable')._aspectRatio = false;      
    }
});

Answer 2

我回答自己：

start: function(e,ui) {
  if (jQuery(e.originalTarget).hasClass("ui-resizable-se")) {
     // Keep aspect ratio function
  }
}

Answer 3

对于单个句柄宽高比可调整大小的jQuery UI，请使用此功能 $（“＃Resize_aspect”）。resizable（{aspectRatio：true}）;

jQuery UI - 调整大小 - 只有一个具有宽高比的句柄

3 个答案: