Splinter

JavaScript library for split HTML text into words and characters. Ideal for creating text animation on a page.

Features

• No dependencies
• Lightweight
• Easy setup

Installation

NPM

npm install splinter.js

CDN

jsDelivr

<script src="https://cdn.jsdelivr.net/npm/splinter.js@latest/build/splinter.min.js"></script>

unpkg

<script src="https://unpkg.com/splinter.js"></script>

Direct download

Download latest release and include the script on your page:

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

Usage

Just write one level of tree in scoped-slot and pass children data to empty child v-tree component and it will inherit the parent slot template.

<div class="content">
  <!-- Text -->
</div>

<script>
const splinter = new Splinter('.content', { mode: 'chars' });
const words = splinter.words; // Array of words
const chars = splinter.chars; // Array of characters
const elements = splinter.elements; // Array of other DOM elements
</script>

Live Demo

License

The MIT License