CSSとJqueryでmousedownの回転キューブを移動する

Question

回転キューブを作成しようとしています。回転キューブは、キューブをクリックしてドラッグすることで、特定の側面に移動できます。私は現在、マウスが画面上でを動かすときに動くものがありますが、これはあなたが望む側面を制御するのが難しくなりますし、キューブの回転を止めることもできません。

私が持っているものの例については、このcodepenを参照してください：キューブを作るhttps://codepen.io/ryan_pixelers/pen/kkVErB

jqueryのコードは、私は滑らかな動きのこの種を必要とするが、場合にのみ、マウス

$(function(){ 
    $(window).mousemove(function(e){ 
    $('.cube').css('transform', 'rotateX(' + - e.pageY + 'deg)' +  'rotateY(' + e.pageX + 'deg)'); 
    }); 
}) 

を回転させますをクリックします。 マウスハウスは動作しません。 [OK]を

おかげ

Answer 1

は、私は右のそれを求めた後、質問を自分自身に答えを考える：

更新jqueryの：

$(function(){ 
    $(window).mousedown(function(){ 
    $(window).mousemove(function(e){ 
     $('.cube').css('transform', 'rotateX(' + - e.pageY + 'deg)' + 'rotateY(' + e.pageX + 'deg)'); 
    }); 

    $(window).mouseup(function(){ 
    $(this).off("mousemove"); 
    }); 

    }); 
})