W3cubDocs

/Web APIs

CaptureController: zoomLevel property

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The zoomLevel read-only property of the CaptureController interface returns the captured display surface's current zoom level.

Value

A number representing the current zoom level of the captured display surface.

Examples

>

Basic zoomLevel usage

In our live demo, shown in Using the Captured Surface Control API, we use the zoomLevel property inside an event handler function for the controller's zoomlevelchange event. When the event fires, the updated zoomLevel is written to an <output> element.

// Create controller and start capture
const controller = new CaptureController();
videoElem.srcObject = await navigator.mediaDevices.getDisplayMedia({
  controller,
});

// ...

controller.addEventListener(
  "zoomlevelchange",
  () => (outputElem.textContent = `${controller.zoomLevel}%`),
);

See Using the Captured Surface Control API for a full working example.

Specifications

Browser compatibility

Desktop Mobile
Chrome Edge Firefox Opera Safari Chrome Android Firefox for Android Opera Android Safari on IOS Samsung Internet WebView Android WebView on iOS
zoomLevel 136 136 No 121 No No No No No No No No

See also

© 2005–2025 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/CaptureController/zoomLevel