CODEWITHSUNDEEP
javascriptcss
Darlyn
Darlyn

Reputation: 4938

Rotating div with mouse

I am building time picker in js where you can set hours on "Real" clocks. I'm rotating div with this script:

if (e.target.id == "rotationSliderContainer") {
    g = e.offsetX;
    h = e.offsetY;
}
var atan = Math.atan2(g - radius, h - radius);
deg = -atan / (Math.PI / 180) + 180;

Although it works it has a little bug, whenever you try to move div between 2/3 and 9/10 its "stops" or freezes, it even returns degrees as NaN when I am rotating div while mouse is still on the div.

I can't find any solution to this little problem.I tried to use asin() instead of atan2 but it still didn't work.

Did I overlook something? demo: http://jsfiddle.net/afo7ky03/6/

Upvotes: 2

Views: 208

Answers (1)

chazsolo
chazsolo

Reputation: 8439

This is your problem

<div id="rotationSliderDegrees">0&deg;</div>

Look in your web developer tools and you'll see that the div stops because your mouse is passing through this div.

Upvotes: 2

Related Questions