在jquery中创建一个可拖动的函数

时间:2014-02-28 19:54:24

标签: javascript jquery jquery-ui

我创建了一个允许用户拖动体内任何元素的函数。我遇到的问题是当用户移动鼠标太快时,它会失去对位置的跟踪。有没有更好的方法来跟踪鼠标? 这是我的功能

$(this).on("mousedown",function(event){
    //$(this).on("click",function(event){       
    $(this).css("cursor","move");
    mouseX = event.pageX;
    mouseY = event.pageY;
    xx = mouseX - $(this).position().left;
    yy = mouseY - $(this).position().top;

    console.log(" mouseX : " +mouseX+ " mouseY : " +mouseY  ) ;
    console.log(" XX : " +xx+ " YY : " +yy  ) ;

    $(this).on("mousemove",function(event){

        startX = event.pageX;
        startY =  event.pageY;
        console.log("after move page X : " +startX+ " page Y : " +startY  ) ;
        console.log("before left : " + $(this).position().left + " top : " + $(this).position().top ) ;
        dragging = true;    
        if(dragging){
            //this.style.top =  startY  - yy + 'px';
            //this.style.left = startX  - xx + 'px';
            //  $(this).animate({"left":(startX  - xx),"top":(startY  - yy)},0);
            $(this).css("top",(startY  - yy));
            $(this).css("left",(startX  - xx));

            console.log("after left : " + this.style.left + " top : " + this.style.top ) ;
        }
    });
});

它确实随光标移动但无法跟进快速移动。

0 个答案:

没有答案