Scroll-in text component for Vue

vue-scrollin

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)

GitHub