StringSplit is an advanced text processing and animation library designed for web developers who wish to create interactive and visually compelling text effects. It offers a powerful API to split text into individually styled HTML elements, enabling detailed customizations, dynamic content updates, and eye-catching animations.
- Text Splitting: Splits text into spans for individual styling and animation.
- Customizable Alignments: Offers control over text alignment within split elements.
- Animation Support: Facilitates complex text animations with CSS and JavaScript.
- Dynamic Content Handling: Seamlessly integrates with dynamic web applications, supporting content updates.
- Randomization and Effects: Allows for text randomization and application of custom effects for unique visual presentations.
- Accessibility: Ensures that split text remains accessible and semantically correct.
Install StringSplit using npm:
npm install @fiddle-digital/string-split
import StringStorage from '@fiddle-digital/string-split';
To start using StringStorage:
const stringSplit = StringSplit.getInstance();
Split text into individual characters for animation:
<div data-string-split data-string-split-align="center">
Your text here
</div>
<div data-string-split data-string-split-global-align="center">
Your text here
</div>
<div data-string-split data-string-split-abs data-string-split-align="center">
Your text here
</div>
<div data-string-split data-string-split-mode="random">
Your text here
</div>