Javascript 使用draggable和rotation-JQuery

我在尝试使用

draggable（）

并在JQuery中使用旋转功能时遇到了一个问题。下面是发生的情况，当用户单击并拖动div时，效果非常好。但如果用户只是点击，它会旋转一点。如果它是旋转的，当您尝试拖动div时，它会跳起来一点。我不知道这是为什么

我认为这与没有收到我在div上定义的正确的

左

和

顶

有关。请告诉我您的想法

代码：

---

$（“#可拖动”）.draggable（）；你能加把小提琴吗？您使用哪种浏览器？我不清楚您的问题，您是否实现了自定义旋转功能？或者你只是看到draggable（）发生了一些意外的旋转？Chrome，所有这些都会发生。IE，FF，Chrome..看我刚输入的更新。一把小提琴会让它更容易
$( "#draggable" ).draggable(); <-- implementation of the draggable feature in JQuery UI

if(direction == "big")
    {
        //get last x and y cordinates
            var x = $("#draggable").css('left');
            var y =$("#draggable").css('top');

        function drawBig() {
            //define new font size
            howMuch = startFontSize + howMuch;
            //define var with new font size
            startFontSize = howMuch;

            //define text font size and family
            ctx.font = howMuch + 'px ' + fFamily;
            //fill with the text
            ctx.fillText(text, 10, 100);
            //draw text
            ctx.globalCompositeOperation = 'source-in';

            ctx.drawImage(img,10, 20, 500, 100);
        }
        //get values
        var current = $(".activeText a div").attr('id');
        var text = $("#fontEnter").val();
        //get font family
        var fFamily = $(".activeText a .fontType-cont").val();
        // default remove old
        $(".customize-Container #draggable").remove();
        //create a canvas for image converting
        $(".customize-Container").append("<div id='draggable'><canvas id='"+current+"'></canvas></div>");
        //create canvas
        var canvas = document.getElementById(current),
        ctx = canvas.getContext('2d'),
        img = document.createElement('img');


        //draw it
        img.onload = drawBig;
        if($(".activeGColor").find('img').attr('src'))
        {
            img.src = $(".activeGColor").find('img').attr('src');   
        }
        else // <!-- default color = metallic
        {
            $(".graphicsDrop").text("Metallic");
            img.src = '../wp-content/themes/twentytwelve/controller/custamizeStyle/swatches/Metallic.png';
        }

        //change where draggable is located:
        $( "#draggable" ).css('top' , y);
        $( "#draggable" ).css('left' , x);

        //check rotation
        if (rotation != 0)
        {
            $("#draggable").css({ transform : 'rotate('+ rotation +'deg)' });
        }
        $( "#draggable" ).draggable();
    }