Videojs 360° / VR plugin by Nuevolab




360° Video / VR feature in Videojs player
Use your mouse or a fingers on touchscreen to move around 360 degrees. Use mousewheel or fingers to zoom VR view.
Use Cardboard button on touchscreen to enter Carboard VR fullscreen mode.
Use navigation control or keyboard (arrows and Home keys) to control wD Perspective.

Key features

  • Smooth 360 perspective changes with ease effect whn mouse down and moved in desktop browsers or when touched & moved on touchscreen.
  • Gyroscope motion integration on mobile devices: The perspective changes as you rotate your phone. On Apple devices since iOS version 12.2 accelerometer and gyroscope sensor access is disabled by default. You need to enable "Motion and Orientation Access" in Safari Privacy Settings.
  • Cardboard/VR mode support: On devices that support it, the Cardboard viewer icon adjust the projection to work with Cardboard-style VR goggles.
  • Zoom perspective support when mousewheel used on desktop browsers.
  • Perspective 2D navigation buttons (optional in desktop player's left or right top corner) to change view horizontally and vertically, or reset perspective view to start position.
  • Perspective 2D keyboard navigation using arrow and Home keys (an optioon).
  • Support for projection type: 360, Sphere, equirectangular, Cube and 360 CUBE.

Player compatibility

  • Compatible with default Videojs player and skin version 6.2.0 or later.
  • Compatible with Videojs player + Nuevo plugin.
  • Compatible with all skins by Nuevolab.com.

Browsers compatibility

  • Chrome Desktop
  • Chrome Mobile (on Android 6+)
  • Firefox Desktop
  • Edge
  • Safari Desktop (with video crossorigin="anonymous" attribute)
  • Safari Mobile (iOS 11.2+)
  • Internet Explorer (pseudo perspective)
Single license: € 18.00
Once plugin purchased and transaction verified, you will receive an email with download link.
ZIP archive contains core plugin javascript file, css stylesheet used by plugin and pure html example with code setup tutorial.

Why Videojs and 360°/VR Plugin by Nuevolab?

Because most of available HTML5 players are either missing 360°/VR support, or such support is buggy in several places or missing useful functions. Finally because some 3rd party 360°/VR plugins are very expensive and not same easy to configure.

Limitations, issues, suggestions

  • MP4 videos are preferred over HLS for videos to use VR plugin.
  • Single bitrate (MP4 or HLS) is required for 360/VR playback
  • High resolution video is required since only a small part of the video is rendered in the player at one time.
  • CORS enabled on streaming server is required if it's other than production server.
    Additionally you must set "crossorigin="anonymous"" attribute for <video> element.
  • On iOS you need to set preload attributefor <video> element to render video correctly.
  • The 360°/VR Plugin does not work with the iOS native player. It is recommended to set the playsinline <video> attribute for non-fullscreen video playback.
  • The 360°/VR Plugin does not work with multiple players on same page. Multiple iframed players will function correctly.
  • The 360°/VR Plugin does not support DRM.
  • The core 360°/VR Plugin does not work in Internet Explorer. However plugin by Nuevolab offers pseudo 360° perspective playback, with mouse screen drag, 2D navigation and keyboard support.
  • The 360°/VR animation speed depends mainly on machine's CPU and browser. The plugin has option to slow it down.