0.1.1 • Published 4 years ago

@marsong11/vue-marquee v0.1.1

Weekly downloads
-
License
MIT
Repository
github
Last release
4 years ago

vue-marquee

A Vue component to marquee,horizontally scrolling when the text is too long

滚动组件,支持文本过长时横向滚动

Screenshot

Screenshot

Install

npm install @marsong11/vue-marquee

# or
yarn add @marsong11/vue-marquee

Usage

<template>
  <div class="container">
    <marquee :data="list" />
  </div>
</template>

<script>
  import Marquee from '@marsong11/vue-marquee';

  export default {
    components: {
      Marquee
    },
    ,
    data() {
      return {
        list: [
          'data1 some text.',
          'data2 balabalabalabala.',
          'data3 long long long long long long long long long long long text.',
          'data4 hahaha.'
        ]
      };
    }
  };
</script>

Options

NameTypeDefaultDescription
dataArray[]content
durationNumber300duration of transition between items (in ms)
delayNumber2500delay between transitions (in ms).
scrollSpeedNumber60the speed of the scrolling (keep number low)
pauseOnHoverBooleanfalsepause on hover