Watch Dogs Like Text Shuffle Animation – swapdogs.js

Category: Animation , Javascript , Text | July 28, 2017
Author:Priler
Views Total:1,172 views
Official Page:Go to website
Last Update:July 28, 2017
License:MIT

Preview:

Watch Dogs Like Text Shuffle Animation – swapdogs.js

Description:

swapdogs.js is a pure JavaScript library that helps you create watch dogs like text animations from an array of text strings.

How to use it:

Create a container element for the text.

<span id="demo">WATCH DOGS</span>

Load the minified version of the swapdogs.js at the end of the document so the pages load faster.

<script src="swapdogs.min.js"></script>

Create a new SwapDogs object and specify an array of text strings you want to rotate through.

var sd = new SwapDogs(
    document.getElementById('demo'),
    {
      autoInit: true,
      words: ["String 1", "String 2", "String 3"]
    }
);

Specify the character set from which you want to pick for the text shuffle animation.

var sd = new SwapDogs(
    document.getElementById('demo'),
    {
      autoInit: true,
      words: ["String 1", "String 2", "String 3"],
      letters: 'abcdefghijklmnopqrstuvwxyz'
    }
);

Set the interval in milliseconds.

var sd = new SwapDogs(
    document.getElementById('demo'),
    {
      autoInit: true,
      words: ["String 1", "String 2", "String 3"],
      letters: 'abcdefghijklmnopqrstuvwxyz',
      interval: 4000,
      interval2: 40
    }
);

You Might Be Interested In:


Leave a Reply