JSFiddle - React, Tailwind, and code Playground
HTML
<div id="obj"></div>
<div id="icon"></div>
<div id="menu"></div>
<button id="button">Hello!</button>
CSS
#obj {
background-color: blue;
}
JavaScript
var button = document.getElementById('button');
button.addEventListener('click', onButtonClick, false);
function onButtonClick () {
zoom('obj', 'icon', 'menu');
};
function zoom(obj, icon, menu) {
var el = document.getElementById(obj);
var img = document.getElementById(icon);
var men = document.getElementById(menu);
var men2 = document.getElementById(menu + "2");
if (el.style.width === "360px") {
el.style.width = "500px";
el.style.height = "308px";
men.style.width = "500px";
men2.style.width = "500px";
if (el.style.width == "500px") {
img.src = "img/icons/png/minimize1.png";
}
} else {
el.style.width = "360px";
el.style.height = "222px";
men.style.width = "360px";
men2.style.width = "360px";
if (el.style.width == "360px") {
img.src = "img/icons/png/expand.png";
}
}
}