9

現在、マウスの入力方向を検出する機能があります。以下に示すように、各セクションの整数 (0 ～ 3) を返します。

例 1

この関数を変更して、この図に基づいて出力を生成する方法を見つけようとしています。

例 2

基本的に、ユーザーが画像を左から入力しているか右から入力しているかを把握したいだけです。試行錯誤を何度か試みましたが、この種の数学はあまり得意ではありません。

例として、コンソール出力を使用して JSFiddle をセットアップしました。

方向を決定する関数は次のとおりです。

function determineDirection($el, pos){
    var w = $el.width(),
        h = $el.height(),
        x = (pos.x - $el.offset().left - (w/2)) * (w > h ? (h/w) : 1),
        y = (pos.y - $el.offset().top  - (h/2)) * (h > w ? (w/h) : 1);

    return Math.round((((Math.atan2(y,x) * (180/Math.PI)) + 180)) / 90 + 3) % 4;
}

posはオブジェクト:{x: e.pageX, y: e.pageY}で、$elはターゲット要素を含む jQuery オブジェクトです。

4

1 に答える 1

5

return Math.round((((Math.atan2(y,x) * (180/Math.PI)) + 180)) / 90 + 3) % 4;と置き換えますreturn (x > 0 ? 0 : 1);

私がより好きな別のオプション（より単純なアイデア）：

function determineDirection($el, pos){
    var w = $el.width(),
        middle = $el.offset().left + w/2;        
    return (pos.x > middle ? 0 : 1);
}
于 2013-05-20T13:47:40.027 に答える