CSS - Scale (Zoom Factor)

About

Scale is the zoom level of a page is first loaded.

When the zooming factor is exactly 100%, one CSS pixel equals one device pixel.

Management

Default

The scale when the page is loaded is defined by the viewport meta tag

Maximum, minimum

The maximum-scale, minimum-scale, and user-scalable properties are defined by the viewport meta tag

Calculation

You can calculate that factor by dividing screen.width by window.innerWidth

onResize = function () {
     zoomFactor=window.innerWidth/screen.width; 
     console.log("The Zooming factor is "+zoomFactor);
}
onResize();

window.onresize = function () {
     zoomFactor=window.innerWidth/screen.width; 
     console.log("The Zooming factor is "+zoomFactor);
}





Discover More
CSS - Pixel (Logical Pixel)

CSS pixels are logical pixels used in CSS declarations such as width: 300px or font-size: 14px. An element with width: 300px is always exactly 300 CSS pixels wide CSS pixels are not the actual pixel...
CSS - Viewport (Reader's window)

The viewport is the viewing area on a screen media. It's then a property of media. The top media of a browser is the window (ie browser tab) As an iframe create a new window, you can set a new viewport...



Share this page:
Follow us:
Task Runner