如何使用ie8中的jquery拖动图像以在屏幕上平滑移动它

时间:2014-03-14 06:14:31

标签: javascript jquery performance internet-explorer-8

我正在开发一个项目,我们可以移动像谷歌地图中的图像,它在crome,ff和以上ie9完美地工作,但是当我在ie8中检查图像不能平滑移动时,它需要2到3秒的时间移动。

/* Map dragging */
    var previousX;
    var previousY;
    var previousLeft;
    var previousTop;
    var cids = self.data.cuLocation;
    var lumids = self.data.lumLocation;
   $('#MapView img').css( 'cursor', 'pointer' );
    $("#MapView img").mousedown(function(e) {
      //console.log("mousedown");

        e.preventDefault();
        drag.state = true;
        previousX = e.originalEvent.clientX;
        previousY = e.originalEvent.clientY;
        previousLeft = $("#MapView img").position().left;
        previousTop = $("#MapView img").position().top;

    });
    $("#MapView img").mousemove(function(e) {
         var old_pos = self.getPosition();
        if (drag.state) {
            e.preventDefault();
            drag.x = e.originalEvent.clientX - previousX;
            drag.y = e.originalEvent.clientY - previousY;

            var cur_position = $("#MapView img").position();
            var new_left = cur_position.left + drag.x;
            var new_top = cur_position.top + drag.y;
            previousX = e.originalEvent.clientX;
            previousY = e.originalEvent.clientY;
        }

    });
     $("#MapView img").mouseleave(function(e) {
      //console.log("mouseleave");
        drag.state = false;
    });
    $(document).mouseup(function(e) {
       // alert("mouseup");
        drag.state = false;
        }); 

1 个答案:

答案 0 :(得分:0)

使用以下链接可以更好地理解Draggable事件,因此您可以使用它在任意位置拖动图像。 http://jqueryui.com/draggable/

和Drap&将一个元素丢弃到其他元素上::  http://jqueryui.com/draggable/#snap-to