---
title: "<ScriptMapLibreFullscreenControl>"
description: "Adds MapLibre's fullscreen button to the nearest parent map. The map container goes fullscreen by default. Pass options.container to make a different element fullscreen."
canonical_url: "https://scripts.nuxt.com/scripts/maplibre/api/fullscreen-control"
last_updated: "2026-09-21T15:42:48.795Z"
---

Adds MapLibre's fullscreen button to the nearest parent map. The map container goes fullscreen by default. Pass `options.container` to make a different element fullscreen.

```vue
<template>
  <ScriptMapLibreMap map-style="https://tiles.openfreemap.org/styles/liberty" :center="[147.33, -42.88]">
    <ScriptMapLibreFullscreenControl
      position="top-right"
      @fullscreenstart="console.log('fullscreen')"
      @fullscreenend="console.log('windowed')"
    />
  </ScriptMapLibreMap>
</template>
```

`new maplibregl.FullscreenControl()`{lang="ts"} reads `options` and `position` once, when it creates the control. To apply a change, change the component `key`.

If the browser has no Fullscreen API, or `options.pseudo` is `true`, MapLibre expands the map with CSS instead.

::script-types{script-key="maplibre" filter="ScriptMapLibreFullscreenControl"}
::

## Sitemap

See the full [sitemap](/sitemap.md) for all pages.