0.4.4 • Published 2 years ago

txt-fx v0.4.4

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

NPM Version

txt-fx

Customizable text effects!

Table of contents

Installation

To install for your project run:

npm i txt-fx

Usage

Simply import the package

import TextFX from 'txt-fx'

Then create an instance of the effect you want and give it the target element.

const fx = new TextFX.Scrambler();
const element = document.querySelector('#headline');
fx.scramble(element);

Effects

Scrambler

Scrambler.scramble

Scrambles the text with random characters in random order.

scrambler

const { scramble } = new TextFX.Scrambler();
scramble(element, delay, count, restore);
ParameterTypeDefault valueDescription
elementelement-target element
delaynumber400delay between changes
countnumberinfinitynumber of iterations
restorebooleanfalserestore text at end of count
itemsstring[] '@', '#', '$', ...random characters to use

Shuffler

Shuffler.shuffle

shuffles the text's order in place.

Shuffler

const { shuffle } = new TextFX.Shuffler();
shuffle(element, delay, count, restore);
ParameterTypeDefault valueDescription
elementelement-target element
delaynumber400delay between changes
countnumberinfinitynumber of iterations
restorebooleanfalserestore text at end of count

Replacer

Replaces each char sequentially with a given char or a char from a list of chars.

Replacer

const { replace } = new TextFX.Replacer();
replace(element, delay, restore, char);
ParameterTypeDefault valueDescription
elementelement-target element
delaynumber400delay between changes
restorebooleanfalserestore text at end of count
charstring || string[]replacement chars

Running the tests

npm test

Contributing

  1. Fork it!
  2. Create your feature branch: git checkout -b my-new-feature
  3. Add your changes: git add .
  4. Commit your changes: git commit -am 'Add some feature'
  5. Push to the branch: git push origin my-new-feature
  6. Submit a pull request :sunglasses:

License

MIT License © Hamid Yuksel

0.4.4

2 years ago

0.4.3

2 years ago

0.4.2

2 years ago

0.4.1

2 years ago

0.4.0

2 years ago

0.3.4

2 years ago

0.3.3

2 years ago

0.3.2

2 years ago

1.0.0

2 years ago