Warmup to practice manipulating the DOM & Events with jQuery. You should use jQuery for all of the following.
When the mouse moves within the body, console.log the x and y coordinates. The docs on mousemove may be helpful here.
Instead of using console.log, replace the text of the h1 with the current coordinates of the mouse.
When the mouse moves, change the css of each of your images so that the margin-left and margin-top change along with the x and y coordinates of your mouse. Read the docs on css. Try dividing the x and y coordinates by a factor (anywhere from 6 - 20) before setting your margin, and make this factor different for each image.
Have it so that when you click on any image, it either adds or removes the ".border" class
Have it so that when you click on the body, it freezes position of the images.
If I click on an image now, for some reason it is freezing the position of all the images. All I want it to do is add or remove the border though. How do I stop that from happening?