This component allows the screen to be faded to and from a solid color. The effect works in both desktop and VR mode. This can be used for situations like loading a scene, handling transitions or snap turning.
Checkout the example: Online Demo | Source
Load the script from npm or add the following script tag:
<script src="https://cdn.jsdelivr.net/npm/@fern-solutions/aframe-screen-fade/dist/screen-fade.umd.min.js"></script>The screen-fade component can be attached to the <a-camera> as follows:
<a-camera screen-fade></a-camera>The fade itself can then be controlled using the intensity property.
| Name | Type | Default | Description |
|---|---|---|---|
color |
color | #000000 | The solid color the screen fades to |
intensity |
float | 0.0 | The intensity of the fade between 0.0 and 1.0 |