是的,所以这里有一个问题 - 如何为可调整大小的 img
元素设置自定义句柄?
我有图像元素,使用 jQuery UI 设置为 resizable()。为了设置自定义句柄,它们需要是可调整大小元素的子元素。然而,这对于图像元素是不可能的。
jQuery UI 文档指定您还可以从可调整大小的元素外部设置句柄: http://api.jqueryui.com/resizable/#option-handles
The value of any specified should be a jQuery selector matching the child element of the resizable to use as that handle. If the handle is not a child of the resizable, you can pass in the DOMElement or a valid jQuery object directly.
我的 JSFiddle:http://jsfiddle.net/asavin/2LXG8/3/
JS:
$('#elementResizable').resizable({
handles: {
'nw': '#nwgrip',
'ne': '#negrip',
'sw': '#swgrip',
'se': '#segrip',
'n': '#ngrip',
'e': '#egrip',
's': '#sgrip',
'w': '#wgrip'
}
});
您可以看到句柄,但它们没有任何作用。
这是关于 SO 的另一个相关问题,也没有答案: jQuery UI resize custom handles, not children of the resized element
我也愿意接受替代解决方案。重点是让图像可调整大小,并具有自定义句柄。
最佳答案
要调整图像大小,您可以这样做:
<div id="mydiv" style="display:inline-block">
<img id="image" src="http://www.google.com.br/images/srpr/logo3w.png" />
</div>
使用 JS:
$('#image').resizable();
这是一个示例:http://jsfiddle.net/kris92/3CfwG/
编辑:我仍在寻找有关自定义句柄的好答案...
编辑:刚刚在这里找到了一个副本 Resizable handles with jQueryUI
关于html - jQuery UI - 可调整大小图像的自定义句柄,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/20379365/