Scroll-in text component for Vue

'vue-scrollin' is a Vue component that scrolls through various characters on mount before revealing the correct text.

Install

Install the package from npm with your favorite package manager (eg. yarn add vue-scrollin or npm i vue-scrollin).

Usage

Simply import and register the component and use it in your template. For example,

<template>
  <VScrollin>
    this text will scroll
  </VScrollin>
</template>

<script>
import VScrollin from 'vue-scrollin'

export default {
  [...]
  components: {
    VScrollin
  }
};
</script>

Props

Easily customise the animation with optional props.

| Property name | Type | Default | Description | |---------------|-------:|:-------:|-----------------------------------------| | characters | Array | a-z | Characters scrolled through | | misses | Number | 4 | Number of scrolls before correct letter | | speed | Number | 80 | Delay of each letter scoll (ms) |