Jquery draggable - получить координаты изображения

Question

У меня есть div, содержащий изображение, которое можно перетаскивать внутри div, чтобы получить координаты для обрезки изображения. Я смог получить правильные координаты, но как только я перетащил изображение в определенную позицию, я не могу перерисовать на другую позицию, если мне не нравится деталь изображения ... где я ошибаюсь ... конечные позиции x + y будут сохранены в скрытый ввод ... вот мой код:

<!-- 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> 

Помогите мне решить мою проблему?

Answer 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);