Skip to content

ReferenceFeatures

Orientation lock

Screen orientation locking while fullscreen is active

Locks screen orientation while fullscreen is active.

Import

import { orientationLockFeature } from '@videojs/react';

No packaged feature bundle includes this feature — add it to your createPlayer features yourself.

API Reference

Configuration

Props the Player component accepts. They exist only while this feature is selected.

PropTypeDefaultDetails
orientationLockTypeundefined | null | 'any' | 'landscape' | 'landscape-primary' | 'landscape-secondary' | 'natural' | 'portrait' | 'portrait-primary' | 'portrait-secondary''landscape'

State

PropertyTypeDetails
orientationLockType'any' | 'landscape' | 'landscape-primary' | 'landscape-secondary' | 'natural' | 'portrait' | 'portrait-primary' | 'portrait-secondary'

Actions

ActionTypeDetails
setOrientationLockTypefunction

Usage

Selecting the feature adds it to the player.

import { Container, createPlayer, features } from '@videojs/react';
import { videoFeatures } from '@videojs/react/video';

export const { Player } = createPlayer({
  features: [...videoFeatures, features.orientationLock],
});

Orientation type

The feature locks to landscape unless the provider sets another Screen Orientation API type. The value can change while the player is running; if the screen is already locked, it re-locks to the new type.

<Player orientationLockType="portrait">
  <Container>
    <Video src="/video.mp4" />
  </Container>
</Player>

Clearing the value restores landscape.

Selector

Pass selectOrientationLock to usePlayer to subscribe to the lock state. Returns undefined if the orientation lock feature is not configured.

import { selectOrientationLock, usePlayer } from '@videojs/react';

function OrientationToggle() {
  const lock = usePlayer(selectOrientationLock);
  if (!lock) return null;

  return (
    <button onClick={() => lock.setOrientationLockType('portrait')}>
      Lock portrait
    </button>
  );
}

Unsupported browsers and rejected lock requests are ignored.