new to HTML and a bit stuck on what to do and cannot find any resources to help me.
I want to make it so whenever I click an image, it scales, I've got the onclick working but I'm not sure on how to let the script know what image I'm clicking.
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<link rel="stylesheet" href="style.css">
<title>Photography</title>
<script type="text/javascript" src="gallery.js"></script>
</head>
<body>
<header>
<h1>hi everybody my name is markiplier</h1>
</header>
<div class="container">
<div class="imggallery">
<div class="imgcolumn">
<div class="photo">
<img onclick="script()" src="images/photography/image0.webp">
</div>
<div class="photo">
<img src="images/photography/IMG_3054.JPG"/>
</div>
<div class="photo">
<img src="images/photography/IMG_3094.JPG"/>
</div>
<div class="photo">
<img src="images/photography/IMG_3069.JPG"/>
</div>
</div>
</div>
</div>
</body>
</html>
JS:
function script(img) {
if (img.classList.contains('zoomed'))
img.style.transform = ''
else {
img.style.transform = '50px'
}
img.classList.toggle('zoomed')
};
