Image Manipulation Lab
Medium
14
4
24.7% Acceptance
In this lab, you have to create an img
tag and three buttons that allow rotating and scaling the image, as well as resetting it back to its original state. You will learn about DOM manipulation, event handling in JavaScript, and CSS transformations.
This will involve:
- Creating an
img
element with a properid
and asrc
attribute containing the URL of an image. - Adding buttons with the correct
id
s and writing event handlers in JavaScript for each of them. - Modifying the CSS
transform
,width
, andheight
properties of the image element according to the user interactions.
Once the lab is completed, you should be able to rotate, scale, and reset an image using buttons.