LaravelLaravel & VueJsVueJs

A Text Swimlane plugin for Vue.js


An Text Swimlane plugin for Vue.js in alpha stage. a list of words as aan animated text Swimlane.

How to use


npm install vue-swimlane --save

Plug in your main.js or where required

import Vue from 'vue'
import Swimlane from 'vue-swimlane'



<vue-swimlane :words="wordsArray" :circular="circular" :rows="rows" :scale="scale" :transitionDuration="duration" :transitionDelay="delay" :transition="transition" :pauseOnHover="true"></vue-swimlane>


Following options can be passed as props.

  • words – string[] – required: Array of tags or words to be used on display.
  • circular – bool (Default: false): If true, list starts from the top after completion.
  • pauseOnHover – bool (Default: false): If true, animation will pause on mouse hover.
  • rows – int (Default: 1): Number of rows always visible at a time.
  • scale – float (Default: 1): Font size scaling relative to 16px.
  • transitionDuration – float in ms (Default: 500): Animation duration for rows.
  • transitionDelay – float in ms (Default: 250): Delays between each animation duration.
  • transition – string (Default: ease-out): css transition name.


Source link

★ READ ALSO ★  Learning Laravel's Eloquent

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.