jquery-ui - 内部要素を持つ jQuery UI のサイズ変更可能なハンドル

Question

サイズ変更可能なハンドルに内部 div を配置しようとしていますが、ハンドルが役に立たなくなります。

<div class="layer" style="width: 150px;">
<div class="left ui-resizable-handle ui-resizable-w">
    <div><<< div</div>
</div>
<div class="right ui-resizable-handle ui-resizable-e">>>></div>
</div>
​
$('.layer').resizable({
    handles: null
});
​

http://jsfiddle.net/MatteS75/3dwVp/15/

どうすればこれを機能させることができますか？

Answer 1

jquery ui のサイズ変更可能なウィジェットの _mouseCapture メソッドをこれに変更すると、機能します。

_mouseCapture: function(event) {
    var capture = false;
    for (var i in this.handles) {
        var handle = $(this.handles[i])[0];
        if (handle == event.target || $.contains(handle, event.target)) {
            capture = true;
        }
    }

    return !this.options.disabled && capture;
},

このためのチケットとプル リクエストも作成しました。

http://bugs.jqueryui.com/ticket/8756