2012-05-16 89 views
0

我有一个div包含一个图像,可以在div内拖动以获取图像裁剪的坐标。我能够得到正确的坐标,但只要我将图像拖动到某个位置,我就无法重新排列到另一个位置,如果我不喜欢图像的细节...我该在哪里出错...最终位置X + Y将被保存到一个隐藏输入...这里是我的代码:jquery draggable - 获取图像坐标

<!-- Div container 350x350px with border where detail of image can be chosen --> 
<div id="draggable"> 
    <!-- Image (bigger than div draggable) that is draggable in the div --> 
<img id="dragimg" src="<?php echo $path_to_image_directory.$filename; ?>" /> 
</div> 


<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#dragimg").draggable({ 
      stop: function(){ 
       var finalxPos = $(this).css('left'); 
       var finalyPos = $(this).css('top'); 
       // alert("Drag stopped!\n\nOffset: (" 
       + finalxPos + ", " + 
       finalyPos + ")\n"); 
       $('#crop [name="finalX"]').val(finalxPos); 
       $('#crop [name="finalY"]').val(finalyPos); 
      } 
     }); 
    }); 
</script> 

你能帮助我解决我的问题?

+0

我认为没有人回答这个问题,因为它似乎工作得很好。我把代码放在http://jsfiddle.net/b8cNk/中,它对我来说似乎没有任何问题。请让小提琴休息一下,然后我们可以提供帮助。 –

回答

1

为了得到他父母的绝对位置是.POSITION()

$('.object').bind('drag',function(){ 

var obj = $(this); 
var position = obj.position(); 
var leftpos = position.left; 
var toppos = position.top; 
}); 

,你可以添加一个输入Val函数像

<input type="text" name="top" id="topVal"/> 

,并在绑定功能

$('#topVal').val(toppos);