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

The proximity events are a handy way to know when a user is close to a device. These events make it possible to react to such a change, for example by shutting down the screen of a smartphone when the user is having a phone call with the device close to their ear.

Note: Obviously, the API requires the device to have a proximity sensor, which are mostly available only on mobile devices. Devices without such a sensor may support those events but will never fire them.

Proximity Events

When the device proximity sensor detects a change between the device and an object, it notifies the browser of that change. When the browser gets such a notification, it fires a DeviceProximityEvent for any change, and a UserProximityEvent event in the case of a more rough change.

This event can be captured at the window object level by using the addEventListener method (using the deviceproximity or userproximity event name) or by attaching an event handler to the window.ondeviceproximity or window.onuserproximity properties.

Once captured, the event object gives access to different kinds of information:

  • The DeviceProximityEvent event provides an exact match for the distance between the device and the object through its value property. It also provides the closest and farthest distance the device is able to detect something through its min and max properties.
  • The UserProximityEvent event provides a rough approximation of the distance, expressed through a boolean. The UserProximityEvent.near property is true if the object is close or false if the object is far.

Example

window.addEventListener('userproximity', function(event) {
  if (event.near) {
    // let's power off the screen
    navigator.mozPower.screenEnabled = false;
  } else {
    // Otherwise, let's power on the screen
    navigator.mozPower.screenEnabled = true;
  }
});

Specifications

Specification Status Comment
Proximity Sensor
The definition of 'Proximity Events' in that specification.
Working Draft Initial specification

Browser compatibility

We're converting our compatibility data into a machine-readable JSON format. This compatibility table still uses the old format, because we haven't yet converted the data it contains. Find out how you can help!

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari
DeviceProximityEvent No support (Yes)[1] No support No support No support
UserProximityEvent No support (Yes)[1] No support No support No support
Feature Android Chrome for Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
DeviceProximityEvent No support No support 15.0 (15.0)[1] No support No support No support
UserProximityEvent No support No support (Yes)[1] No support No support No support

[1] These events have been disabled by default in Firefox 60, behind the device.sensors.proximity.enabled preference (bug 1359076).

See also

Document Tags and Contributors

 Contributors to this page: chrisdavidmills, YuichiNukiyama, teoli, kscarfone, samdutton, Jeremie
 Last updated by: chrisdavidmills,