jquery - 複数の要素に対して、マスクの下でドラッグ可能なjquery

Question

http://jsfiddle.net/QdbNe/1/

私が試したサンプルを確認できます。基本的に、ユーザーがどれをクリックしたかに応じて、半透明のマスク内の 3 つの色付きの四角形の周りをドラッグできるようにする必要があります。しかし問題は、ユーザーがクリックしている子をどのように判断するかということです。クリック イベントは、子ではなくマスクで実際に発生するためです。

だから私は何かをする必要があります

$("#mask").mousedown(function(e){
        var currentChild = //Somehow fetch the current child
        currentChild.trigger(e);
    });

何か案は？

Answer 1

透明マスクの理由はありますか？そうでない場合は、次のことが機能する可能性があります。

$("#child1, #child2, #child3").draggable({
    stop:function(e,ui){
        alert(e.target.id);
    }
});

更新されたフィドル http://jsfiddle.net/QdbNe/1/

Answer 2

私にとって、ジョナサンの答えは問題を解決します

$("#mask").mousedown(function(e){
        $("#child1").trigger(e);
    });

したがって、要素は視覚的に部分的に隠されていますが、移動できます。