# sindresorhus/screenfull

**Attribution required: if you use, quote, or summarise this content, you must credit and link back to [awesome-repositories.com](https://awesome-repositories.com/repository/sindresorhus-screenfull).**

7,144 stars · 683 forks · HTML · MIT

## Links

- GitHub: https://github.com/sindresorhus/screenfull
- Homepage: https://sindresorhus.com/screenfull
- awesome-repositories: https://awesome-repositories.com/repository/sindresorhus-screenfull.md

## Description

Screenfull is a lightweight JavaScript utility that wraps the browser's Fullscreen API into a single, consistent interface. It normalizes the vendor-prefixed fullscreen methods across different browsers, providing a unified way to request, exit, and toggle fullscreen mode on any DOM element or the entire page.

The library handles cross-browser differences automatically, abstracting away the webkit, moz, and ms prefixes behind a clean API. It includes runtime feature detection to check browser support before exposing fullscreen methods, and uses promises for asynchronous fullscreen requests and exits, enabling straightforward error handling and chaining. Screenfull also provides event-driven state tracking, listening to native fullscreenchange and fullscreenerror events to maintain accurate internal state and fire callbacks when fullscreen mode is entered, exited, or fails.

Beyond the core request and exit functions, Screenfull offers a toggle method that automatically determines whether to enter or exit fullscreen based on the current state. It includes utilities for querying the current fullscreen element, checking whether fullscreen is active, and attaching or removing event listeners for change and error events. The library also provides a fullscreen availability check that considers iframe permissions, helping developers avoid runtime errors when fullscreen is not permitted.

## Tags

### Web Development

- [Fullscreen API Wrappers](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-entry-request/fullscreen-api-wrappers.md) — The core purpose of the library: a cross-browser wrapper for the Fullscreen API.
- [Browser API Normalizers](https://awesome-repositories.com/f/web-development/browser-api-normalizers.md) — Normalizes browser-specific Fullscreen API methods into a single consistent interface.
- [Fullscreen Target Mapping](https://awesome-repositories.com/f/web-development/dom-element-selectors/fullscreen-target-mapping.md) — Allows requesting fullscreen on a specific DOM element or the entire document.
- [Fullscreen Feature Detectors](https://awesome-repositories.com/f/web-development/feature-detection-polyfills/runtime-bundling/fullscreen-feature-detectors.md) — Checks browser support for fullscreen methods before exposing them.
- [Fullscreen Management](https://awesome-repositories.com/f/web-development/fullscreen-management.md) — Provides a unified API to detect whether the document is currently in fullscreen mode. ([source](https://github.com/sindresorhus/screenfull/blob/main/readme.md))
- [Native Fullscreen Toggles](https://awesome-repositories.com/f/web-development/fullscreen-management/css-fullscreen-modes/native-fullscreen-toggles.md) — Provides a toggle method that automatically enters or exits native fullscreen mode. ([source](https://github.com/sindresorhus/screenfull))
- [Fullscreen Entry Request](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-entry-request.md) — Requests fullscreen for a specific DOM element or the whole page, returning a promise. ([source](https://github.com/sindresorhus/screenfull))
- [Fullscreen Exit Request](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-exit-request.md) — Exits fullscreen mode and returns to normal view, resolving a promise when done. ([source](https://github.com/sindresorhus/screenfull/blob/main/readme.md))
- [Fullscreen Toggle Requests](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-exit-request/fullscreen-toggle-requests.md) — Ships a toggle method that returns a promise when fullscreen mode changes. ([source](https://github.com/sindresorhus/screenfull/blob/main/readme.md))
- [Fullscreen Toggle Utilities](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-exit-request/fullscreen-toggle-utilities.md) — Provides a toggle utility that automatically determines whether to enter or exit fullscreen.
- [Fullscreen Mode Togglers](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-mode-togglers.md) — Switches a page or element into fullscreen mode using a consistent cross-browser wrapper. ([source](https://github.com/sindresorhus/screenfull/blob/main/.gitattributes))
- [Vendor Prefix Normalizers](https://awesome-repositories.com/f/web-development/vendor-prefix-normalizers.md) — Normalizes vendor-prefixed fullscreen method names across browsers into a unified API.
- [Fullscreen Event Listeners](https://awesome-repositories.com/f/web-development/event-listeners/realtime-connection-state-listeners/browser-event-listeners/fullscreen-event-listeners.md) — Provides cross-browser event listener attachment for fullscreen state changes and errors.
- [Fullscreen Change Callbacks](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-change-callbacks.md) — Fires a callback whenever the fullscreen state changes. ([source](https://github.com/sindresorhus/screenfull/blob/main/index.d.ts))
- [Fullscreen Event Detachers](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-event-detachers.md) — Detaches previously registered callbacks from fullscreen change or error events. ([source](https://github.com/sindresorhus/screenfull))
- [Fullscreen Event Subscribers](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-event-subscribers.md) — Subscribes to fullscreen change and error events for reactive behavior. ([source](https://github.com/sindresorhus/screenfull/blob/main/readme.md))
- [Fullscreen Permission Checkers](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-permission-checkers.md) — Checks whether the browser permits entering fullscreen mode, considering iframe permissions. ([source](https://github.com/sindresorhus/screenfull))
- [Fullscreen Support Detectors](https://awesome-repositories.com/f/web-development/fullscreen-management/fullscreen-support-detectors.md) — Provides a function to check fullscreen availability, considering iframe permissions. ([source](https://github.com/sindresorhus/screenfull/blob/main/readme.md))

### User Interface & Experience

- [Fullscreen State Trackers](https://awesome-repositories.com/f/user-interface-experience/event-driven-state-managers/event-driven-state-synchronizers/fullscreen-state-trackers.md) — Listens to native fullscreen events to maintain accurate internal state.
- [Fullscreen State Toggles](https://awesome-repositories.com/f/user-interface-experience/presentation-frameworks/presentation-modes/fullscreen-controls/windowed-fullscreen-toggles/fullscreen-state-toggles.md) — Provides a single toggle method that automatically enters or exits fullscreen.

### Data & Databases

- [Fullscreen Event Attachers](https://awesome-repositories.com/f/data-databases/account-discovery/wechat/fullscreen-playbacks/fullscreen-event-attachers.md) — Attaches callbacks for fullscreen entry, exit, and error events. ([source](https://github.com/sindresorhus/screenfull))

### Programming Languages & Runtimes

- [Promise-Based Chains](https://awesome-repositories.com/f/programming-languages-runtimes/runtime-execution-environments/runtime-environments/runtimes/asynchronous-execution-engines/asynchronous-control-flows/promise-based-flow-control/promise-based-chains.md) — Wraps fullscreen requests and exits in promises for chaining and error handling.