He implementado un botón y un círculo. Tan pronto como haga clic en el botón, el círculo se amplía 10 veces. Desafortunadamente, esto no sucede tan bien. ¿Existe la posibilidad de añadir una animación a la ampliación? Desafortunadamente, todavía no he encontrado nada en Internet.
function zoom() { let example = document.getElementById("a"); example.style.zoom = 10.0; } div.circle { width: 25px; height: 25px; border-radius: 100%; background-color: orange; } <button onclick="zoom()">Zoom</button> <div id="a" class="circle"></div>La propiedad de zoom no es estándar . En su lugar, debe usar la propiedad de transformación y escalar el círculo.
function zoom() { let example = document.getElementById("a"); example.style.transform = "scale(10,10)"; } div.circle { width: 25px; height: 25px; border-radius: 100%; background-color: orange; transition: transform 0.5s; transform-origin: top left; } <button onclick="zoom()">Zoom</button> <div id="a" class="circle"></div>