I have an image of an arrow that rotates around a fixed central point and I want to make it to where it moves in the direction of a mouse click. So someone can click somewhere on the screen and the arrow will point in the direction of the mouse click.
This is what the arrow looks like:
And this is what the code of the div looks like
content.innerHTML+= '<img class = "arrow" style="transform: rotate('+x+'deg)" src="img/arrow.png"</img>'
and the CSS for those interested:
.arrow {
width: 200px;
height: 10px;
position: absolute;
transform-origin: 100% 50%;
}
Any pointers appreciated! Thanks!