Show mouse position while clicking by jQuery

Question

I want to make a rotation tool in my site, in an image inside a canvas. As I first step I want to find the mouse co-ordinates every time, so as to force later the image to rotate according to this. I know that I can use mousemove which will give me the coordinates as long as I am moving the mouse. But what I want, is to keep the mouse pressed and moving it and then get the coordinates. So not just mousemove but mouse clicked and move. Is there a way to do something like that?

Thanks in advance

Answer 1

There isn't really a combined event, but you could set a variable to check whether the mouse is held down then only deal with the coords if it's true? See: http://jsfiddle.net/Vrpd3/1/

The 'mouseout' event is to stop it recording after you drag out of the element, release the click then hover back over.

Answer 2

If what you aim to do is getting X,Y cords while moving the mouse as it's clicked, check out this JsFiddle *Most of the code is taken directly from jQuery documentation , I've just made few changes. If you want to drag an object an getting the cordinated while dragging, I've got you wrong and the example above is not useful for your case

Answer 3

have a look at this page.

You can change it according to your need.

http://jqueryui.com/demos/draggable/

http://jqueryui.com/demos/draggable/#events

its a draggable facility of Jquery.

$('#id').draggable({
drag: function(event, ui) {
    var toppos =ui.position.top
    var leftpos = ui.position.left
}
});

So for each drag you can know the position of the draggable object. and yes you will get relative position from the position where you have initially put your draggable div. and not the absolute within the page.