jQuery UI可调整大小处理命中区域/灵敏度/容差

Question

我正在使用jQuery ui resizable，我（个人）发现它就像一个视频游戏来确定你试图调整元素大小时的命中区域。

似乎命中区域是div边缘的单个像素！ WT ...

有谁知道如何增加手柄的命中区域/容差，这样您就不必像外科医生那样移动鼠标来抓住div的边缘了？

Answer 1

可调整大小的句柄具有类ui-resizable-handle。您可以根据自己的便利和选择设置这些类的样式。 你可以增加它们的尺寸，尺寸，形状等。 例如：

.ui-resizable-handle{width:0;height:0;border:4px solid blue;border-radius:10px;}

在这种情况下，您将拥有可调整大小的圆形手柄，蓝色和更大的手柄。

.ui-resizable-handle{width:0;height:0;border:4px solid blue;}

在这种情况下，手柄的形状为矩形。 所以，你可以用这些句柄用CSS做任何你想做的事。

演示：http://jsfiddle.net/lotusgodkk/GCu2D/92/

Answer 2

您可以将jquery引用传递给句柄，如下所示：

$('#elementResizable').resizable({
    handles: {
        'n': '#ngrip',
        'e': '#egrip',
        's': '#sgrip',
        'w': '#wgrip'
    }
});

Demo that I found