Detect XR Support with JavaScript

By  on  

A few years ago I wrote an article about how to detect VR support with JavaScript. Since that time, a whole lot has changed. "Augmented reality" became a thing and terminology has moved to "XR", instead of VR or AR. As such, the API has needed to evolve.

The presence of navigator.xr signals that the browser supports the WebXR API and XR devices:

const supportsXR = 'xr' in window.navigator;

I really like using in for feature checking rather than if(navigator.xr), as simply invoking that could cause some initialization to take place. In future posts we'll explore identifying and connecting to different devices.

Recent Features

Incredible Demos

  • By
    New MooTools Plugin:  ElementFilter

    My new MooTools plugin, ElementFilter, provides a great way for you to allow users to search through the text of any mix of elements. Simply provide a text input box and ElementFilter does the rest of the work. The XHTML I've used a list for this example...

  • By
    Rotate Elements with CSS Transformations

    I've gone on a million rants about the lack of progress with CSS and how I'm happy that both JavaScript and browser-specific CSS have tried to push web design forward. One of those browser-specific CSS properties we love is CSS transformations. CSS transformations...

Discussion

    Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!