css+y轴平移,如何使用css translate实现平移？

我试图在视口上实现平移，当鼠标在容器上拖动时，其内部的元素应该移动问题是每次我开始将元素重置拖动到其第一个位置时。

此外，元素内部继承的事件不应该发生，因为点击时偏移量发生了变化。如何使用css translate实现平移？

的Javascript：

var obj = {startPositionX:0,startPositionY:0};

var scale=1.0;

var translate = {x:0,y:0};

$('#container').on("mousedown",function(e){

var container = $(this);

var move = $('#move');

console.log($('#container').offset().left, container.offset().top);

obj.startPositionX=e.offsetX+container.offset().left+20;

obj.startPositionY=e.offsetY+container.offset().top+30;

$(document).on("mousemove",function(e){

console.log("dragging", e.pageX-obj.startPositionX, e.pageY-obj.startPositionY);

translate.x=e.pageX-obj.startPositionX;

translate.y=e.pageY-obj.startPositionY;

$('#move').css('transform','scale('+scale+') translate('+translate.x+'px, '+translate.y+'px)');

});

});

$(document).on("mouseup",function(){

$(this).off("mousemove");

});

2013-12-12

shuji

+1

*“此外，当开始元素THI内拖动s的动作20px“* 20px与顶部和左边的值相同。删除它，它消失。如果您希望它在20,20开始，请使用与拖动时/拖动后使用的翻译样式相同的翻译样式。 http://jsfiddle.net/dML5t/5/ –

+0

如果我删除它，那么当我开始在元素外部移动那些20也被删除。 –

+0

没错，但是您可以在移动开始时移除它，然后在添加之后添加它，根据需要调整翻译。我的观点是，这是跳跃的来源，你必须补偿它。 –