Svelte Fullscreen
Component that performs fullscreen in DOM Elements
Svelte FullScreen
Component that performs fullscreen in DOM Elements
Installation
npm i svelte-fullscreen
// OR
yarn add svelte-fullscreen
Note: to use this library in sapper, install as devDependency. See the link.
Demo Link
Local demo:
git clone https://github.com/andrelmlins/svelte-fullscreen.git
cd svelte-fullscreen
yarn install && yarn start
Examples
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>
Properties
Raw component props (before transform):
| Prop | Type | Description |
|---|---|---|
| change | func | Call in change |
| error | func | Call in error |
Slot Properties
Raw component props (before transform):
| Prop | Type | Description |
|---|---|---|
| onToggle | func | Call for fullscreen toggle |
| onExit | func | Call for fullscreen exit |
| onRequest | func | Call for fullscreen enter |
Browsers Support
You can see the list of supported browsers here
License
Svelte FullScreen is open source software licensed as MIT.
