Zoom

JxBrowser allows you to zoom content of a web page or of all web pages, get notifications when the zoom level of a web page has been changed, override the default zoom level, etc.

To work with the global zoom that will apply to all web pages please use the ZoomLevels class. An instance of this class you can obtain from Profile. For example:

var zoomLevels = profile.zoomLevels();

val zoomLevels = profile.zoomLevels()

If you use Engine.zoomLevels() then you get the ZoomLevels instance associated with the default profile.

To control zoom of a web page loaded in a Browser instance use the Zoom class.

Default zoom level 

The default zoom level for all web pages is 100%. To change the default zoom level please use the ZoomLevels.defaultLevel(ZoomLevel) method.

The following code sets the default zoom level for all web pages to 150%:

zoomLevels.defaultLevel(ZoomLevel.P_150);

zoomLevels.defaultLevel = ZoomLevel.P_150

Zoom mode 

By default, zoom is scoped to the origin of the loaded web page. If two browsers in the same profile both display pages from https://example.com, zooming in one of them changes the zoom level in the other as well. This is the PER_ORIGIN mode.

If you want zoom to apply only to a specific browser, switch to the PER_BROWSER mode:

browser.zoom().mode(ZoomMode.PER_BROWSER);

browser.zoom().mode(ZoomMode.PER_BROWSER)

In this mode, changing the zoom level in one browser does not affect other browsers, even when they display pages from the same origin.

Changing the mode preserves the current zoom level. The mode can be changed even when zoom is disabled — it takes effect when zoom is enabled again.

To switch back to the default behavior:

browser.zoom().mode(ZoomMode.PER_ORIGIN);

browser.zoom().mode(ZoomMode.PER_ORIGIN)

Controlling zoom 

You can zoom content of a web page loaded in Browser programmatically using the Zoom class or using touch gestures in environments with a touch screen.

Zoom in 

To perform zoom in on a currently loaded web page use the following method:

zoom.in();

zoom.`in`()

Zoom out 

To perform zoom out on a currently loaded web page use the following method:

zoom.out();

zoom.out()

Setting zoom level 

The following code sets zoom level of the loaded web page to 200%:

zoom.level(ZoomLevel.P_200);

zoom.level = ZoomLevel.P_200

Resetting zoom 

To reset zoom level to the default value use the following code:

zoom.reset();

zoom.reset()

Disabling zoom 

You can disable zoom for all web pages loaded in a Browser using the Zoom.disable() method. This method disables the zoom functionality and resets the zoom level to the default value. After that all attempts to change the zoom level programmatically via JxBrowser Zoom API and using touch gestures on a touch screen device will be ignored.

For example:

zoom.disable();

zoom.disable()

Zoom events 

To get notifications when the zoom level for a particular web page has been changed use the ZoomLevelChanged event. For example:

zoomLevels.on(ZoomLevelChanged.class, event -> {
    var host = event.host();
    var zoomLevel = event.level();
});

zoomLevels.subscribe<ZoomLevelChanged> { event ->
    val host = event.host()
    val zoomLevel = event.level()
}

Pinch to zoom 

Currently, JxBrowser does not support zoom via a pinch-to-zoom trackpad gesture on macOS.