Dividir cadena de texto en caracteres individuales-Charming. js

Vista prévia

Descripción

Charming. js es una biblioteca de JavaScript de prue ES6 que divide las cadenas de texto en caracteres individuales envueltos en los elementos de span correspondientes para que puedas darles estilo en el CSS. Inspirado por el jQuery < a href = "http://www.jqueryscript.net/text/Powerful-Web-Typography-Plugin-Lettering-js.html" target = "_ blank" rel = "noopener noreferrer" > Lettering. js plugin.

Instalación

# Yarn
yarn add charming

# NPM
$ npm install charming

How to use it:

Importa el encanto en tu proyecto.

const charming = require('charming')

Inicialice la biblioteca con encanto y especifique el nodo de texto de destino.

var element = document.querySelector("h1");
charming(element);

Esto convertirá …

<h1>Charming</h1>

En …

<h1>

<span class="char1">C</span>

<span class="char2">h</span>

<span class="char3">a</span>

<span class="char4">r</span>

<span class="char5">m</span>

<span class="char6">i</span>

<span class="char7">n</span>

<span class="char8">g</span>
</h1>

Reemplace el prefijo CSS predeterminado.

var element = document.querySelector("h1");
charming(element,{

classPrefix: 'char'
});

Reemplace el elemento de ajuste predeterminado.

var element = document.querySelector("h1");
charming(element,{

 tagName: 'span'
});

Registro de cambios

v2.2.4 (06/09/2018)

• JS & actualización de CSS