jquery transformable top and left position

Question

i have two images in a page first image is a large image and second image is a small image placed in a div on big image small image can be drag and drop and rotate to any degree on big image after that i want to save these two images as one image in php

here is live code

http://jsfiddle.net/cQyvG/

but problem is that when i drag small image around i cant get the image position on big image where it is placed

here is my php code photoRotation = $_POST["img_angle"];

$image_2 = imagecreatefrompng($sec);
$image_2 = imagerotate($image_2,$photoRotation, -1,0);
$image_1 = imagecreatefromjpeg($first);

imagecopy($image_1, $image_2,$_POST["img_left"],$_POST["img_top"], 0, 0, $_POST["img_width"],$_POST["img_hight"]);

this is working but i always get second image on wrong position

jquery.transformable.js http://plugins.jquery.com/plugin-tags/jquerytransformablejs

Answer 1

Try getting its .offset() , not the .position() :

var position = p.offset();