1.0.0 • Published 4 years ago
svelte-matrix v1.0.0
svelte-matrix
Rebuild the Matrix on your Svelte applications with this amazing effect
Installation
# yarn
yarn add -D svelte-matrix
# npm
npm i -D svelte-matrix
Usage
<script>
import Matrix from 'svelte-matrix'
</script>
<Matrix />
Options
You can control the behavior of the matrix effect by passing specific props to the <Matrix />
component
width
The width of the Matrix canvas
default: window.innerWidth
Example:
<Matrix width={300} />
height
The height of the Matrix canvas
default: window.innerHeight
Example:
<Matrix height={150} />
noInitialDrop
Disables the initial column drop animation
default: false
Example:
<Matrix noInitialDrop />
fontSize
Sets the font size of the Matrix characters
default: 16
Example:
<Matrix fontSize={24} />
color
Sets the font color of the Matrix characters
default: '#0f0'
Example:
<Matrix color='#fff' />
interval
Sets the time interval of the fall speed of the characters
default: 33
Example:
<Matrix interval={33} />
1.0.0
4 years ago