How to recreate browser zoom in a react project

Question

I'm searching for a zoom that works exactly the browser's zoom.

I've tried some but in the 3D viewer (three.js) the zoom is breaking the page.

I have to set the zoom at 80%, doing it directly from the browser Zoom perfectly works but setting it from code works for all the pages excluding the 3d viewer

i'v tried with

zoom: 0.8;

transform: scale(0.5)

document.body.style.zoom = "80%"

Do you mean to zoom the page or the scene? To "zoom" inside the scene, you'd have to move the camera in the scene (which is completely unrelated to the page). Your attempts so far only affect the page. — Davi
– Davi, Commented Aug 22, 2024 at 13:30
I mean the page because the container with the zoom at 80% doesn't cover 100% of the page. (For example in /home 80% zoom looks good and the page covers the 100% of the screen and the same for other routes. In /viewer the container turns to 80% and doesn't cover all the page anymore.) Idk if if I managed to explain myself — Alessandro Ballarin AleBalla
– Alessandro Ballarin AleBalla, Commented Aug 22, 2024 at 14:47
Please clarify your specific problem or provide additional details to highlight exactly what you need. As it's currently written, it's hard to tell exactly what you're asking. — Community
– Community Bot, Commented Aug 24, 2024 at 16:26

Alessandro Ballarin AleBalla · Accepted Answer · 2024-08-22 14:50:48Z

0

Solved!

I modified the CSS body zoom to 0.8. I've created an ID for the viewer container, and from CSS put the zoom to 1.25

answered Aug 22, 2024 at 14:50

Alessandro Ballarin AleBalla

11 bronze badge

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to recreate browser zoom in a react project

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related