• • • •

Component that performs fullscreen in DOM Elements

npm i svelte-fullscreen
// OR
yarn add svelte-fullscreen

Note: to use this library in sapper, install as devDependency. See the link.

Local demo:

git clone https://github.com/andrelmlins/svelte-fullscreen.git
cd svelte-fullscreen
yarn install && yarn start

An example of how to use the library:

<script>
  import Fullscreen from "svelte-fullscreen";
</script>

<style>
  div {
    background-color: red;
    width: 120px;
    height: 120px;
  }
</style>

<Fullscreen let:onRequest let:onExit>
  <div>
    <button on:click={() => onRequest()}>FullScreen</button>
    <button on:click={() => onExit()}>Screen</button>
  </div>
</Fullscreen>

Raw component props (before transform):

Raw component props (before transform):

You can see the list of supported browsers here

Svelte FullScreen is open source software licensed as MIT.