We used CSS to draw 2 eyes and their pupils. We used the 'onmousemove' event in JavaScript to show the pupils following the position of the mouse cursor. The pupils move relative to the area defined by the outline of the eye. You can see the center of the pupil reaches the border of the eye when the cursor reaches the edge of the screen. The eye border is actually a rectangle, with a radiused border to look oval.
- Clone Repository to your local environment.
- Open index.html in a Web Browser.
- Move your cursor around the screen and the pupils in the eyes should follow.
- Make the eyes cross when the cursor is between them.
MIT License