---
title: "FullscreenControl | JavaScript maps SDK"
description: "Documentation for MapTiler SDK"
---

> For AI agents: a documentation index is available at [/llms.txt](https://docs.maptiler.com/llms.txt). Markdown versions of all pages are available by appending .md to any URL.

# Class FullscreenControl

A `FullscreenControl` control contains a button for toggling the map in and out of fullscreen mode. When [requestFullscreen](https://developer.mozilla.org/en-US/docs/Web/API/Element/requestFullscreen) is not supported, fullscreen is handled via CSS properties. The map's `cooperativeGestures` option is temporarily disabled while the map is in fullscreen mode, and is restored when the map exist fullscreen mode.

#### Param: options[](#param-options)

the full screen control options

#### Example[](#example)

```typescript
map.addControl(new FullscreenControl({container: document.querySelector('body')}));
```

#### See[](#see)

[View a fullscreen map](https://maplibre.org/maplibre-gl-js/docs/examples/view-a-fullscreen-map/)

## Events[](#events)

**Event** `fullscreenstart` of type [Event](https://docs.maptiler.com/sdk-js/api-reference/classes/Event/) will be fired when fullscreen mode has started.

**Event** `fullscreenend` of type [Event](https://docs.maptiler.com/sdk-js/api-reference/classes/Event/) will be fired when fullscreen mode has ended.

#### Hierarchy ([View Summary](https://docs.maptiler.com/sdk-js/api-reference/hierarchy/#Externals.FullscreenControl))

-   [Evented](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/)
    -   FullscreenControl
        -   [FullscreenControl](https://docs.maptiler.com/sdk-js/api-reference/classes/FullscreenControl/)

#### Implements

-   [IControl](https://docs.maptiler.com/sdk-js/api-reference/interfaces/IControl/)

##### Index

### Constructors[](#constructors)

[constructor](#constructor)

### Methods[](#methods)

[fire](#fire) [listens](#listens) [off](#off) [on](#on) [onAdd](#onadd) [once](#once) [onRemove](#onremove) [setEventedParent](#seteventedparent)

## Constructors[](#constructors-1)

### constructor[](#constructor)

-   new FullscreenControl(options?: [FullscreenControlOptions](https://docs.maptiler.com/sdk-js/api-reference/types/FullscreenControlOptions/)): FullscreenControl[](#constructorfullscreencontrol)
    
    #### Parameters
    
    -   `Optional`options: [FullscreenControlOptions](https://docs.maptiler.com/sdk-js/api-reference/types/FullscreenControlOptions/)
        
        the control's options
        
    
    #### Returns FullscreenControl
    
    Overrides [Evented](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/).[constructor](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/#constructor)
    

## Methods[](#methods-1)

### fire[](#fire)

-   fire(event: string | [Event](https://docs.maptiler.com/sdk-js/api-reference/classes/Event/), properties?: any): this[](#fire-1)
    
    #### Parameters
    
    -   event: string | [Event](https://docs.maptiler.com/sdk-js/api-reference/classes/Event/)
    -   `Optional`properties: any
    
    #### Returns this
    
    Inherited from [Evented](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/).[fire](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/#fire)
    

### listens[](#listens)

-   listens(type: string): boolean[](#listens-1)
    
    Returns a true if this instance of Evented or any forwardeed instances of Evented have a listener for the specified type.
    
    #### Parameters
    
    -   type: string
        
        The event type
        
    
    #### Returns boolean
    
    `true` if there is at least one registered listener for specified event type, `false` otherwise
    
    Inherited from [Evented](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/).[listens](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/#listens)
    

### off[](#off)

-   off(type: string, listener: [Listener](https://docs.maptiler.com/sdk-js/api-reference/types/Listener/)): this[](#off-1)
    
    Removes a previously registered event listener.
    
    #### Parameters
    
    -   type: string
        
        The event type to remove listeners for.
        
    -   listener: [Listener](https://docs.maptiler.com/sdk-js/api-reference/types/Listener/)
        
        The listener function to remove.
        
    
    #### Returns this
    
    Inherited from [Evented](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/).[off](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/#off)
    

### on[](#on)

-   on(type: string, listener: [Listener](https://docs.maptiler.com/sdk-js/api-reference/types/Listener/)): [Subscription](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Subscription/)[](#on-1)
    
    Adds a listener to a specified event type.
    
    #### Parameters
    
    -   type: string
        
        The event type to add a listen for.
        
    -   listener: [Listener](https://docs.maptiler.com/sdk-js/api-reference/types/Listener/)
        
        The function to be called when the event is fired. The listener function is called with the data object passed to `fire`, extended with `target` and `type` properties.
        
    
    #### Returns [Subscription](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Subscription/)
    
    Inherited from [Evented](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/).[on](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/#on)
    

### onAdd[](#onadd)

-   onAdd(map: [MapLibreMap](https://docs.maptiler.com/sdk-js/api-reference/classes/MapLibreMap/)): [HTMLElement](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.HTMLElement/)[](#onadd-1)
    
    Register a control on the map and give it a chance to register event listeners and resources. This method is called by [Map.addControl](https://docs.maptiler.com/sdk-js/api-reference/classes/Map/#addcontrol) internally.
    
    #### Parameters
    
    -   map: [MapLibreMap](https://docs.maptiler.com/sdk-js/api-reference/classes/MapLibreMap/)
        
        the Map this control will be added to
        
    
    #### Returns [HTMLElement](https://docs.maptiler.com/sdk-js/api-reference/interfaces/Externals.HTMLElement/)
    
    The control's container element. This should be created by the control and returned by onAdd without being attached to the DOM: the map will insert the control's element into the DOM as necessary.
    
    Implementation of [IControl](https://docs.maptiler.com/sdk-js/api-reference/interfaces/IControl/).[onAdd](https://docs.maptiler.com/sdk-js/api-reference/interfaces/IControl/#onadd)
    

### once[](#once)

-   once(type: string, listener?: [Listener](https://docs.maptiler.com/sdk-js/api-reference/types/Listener/)): FullscreenControl | Promise<any\>[](#once-1)
    
    Adds a listener that will be called only once to a specified event type.
    
    The listener will be called first time the event fires after the listener is registered.
    
    #### Parameters
    
    -   type: string
        
        The event type to listen for.
        
    -   `Optional`listener: [Listener](https://docs.maptiler.com/sdk-js/api-reference/types/Listener/)
        
        The function to be called when the event is fired the first time.
        
    
    #### Returns FullscreenControl | Promise<any\>
    
    `this` or a promise if a listener is not provided
    
    Inherited from [Evented](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/).[once](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/#once)
    

### onRemove[](#onremove)

-   onRemove(): void[](#onremove-1)
    
    Unregister a control on the map and give it a chance to detach event listeners and resources. This method is called by [Map.removeControl](https://docs.maptiler.com/sdk-js/api-reference/classes/Map/#removecontrol) internally.
    
    #### Returns void
    
    Implementation of [IControl](https://docs.maptiler.com/sdk-js/api-reference/interfaces/IControl/).[onRemove](https://docs.maptiler.com/sdk-js/api-reference/interfaces/IControl/#onremove)
    

### setEventedParent[](#seteventedparent)

-   setEventedParent(parent?: [Evented](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/) | null, data?: any): this[](#seteventedparent-1)
    
    Bubble all events fired by this instance of Evented to this parent instance of Evented.
    
    #### Parameters
    
    -   `Optional`parent: [Evented](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/) | null
    -   `Optional`data: any
    
    #### Returns this
    
    Inherited from [Evented](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/).[setEventedParent](https://docs.maptiler.com/sdk-js/api-reference/classes/Externals.Evented/#seteventedparent)