Biblioteca de animaciones ASCII en Pure JavaScript-AnimASCII

Tiempo de ejecución: 30 minutos. Empezar

Autor: TheGreatRambler
Views Total: 1,121
Sitio oficial: Ir a la web
Actualizado: February 5, 2018
Licencia: MIT

Vista prévia

Biblioteca de animaciones ASCII en Pure JavaScript-AnimASCII

Descripción

AnimASCII es una biblioteca de JavaScript para animar caracteres ASCII mediante el lienzo.

Funcionamiento

Incluya las bibliotecas necesarias < a href = "https://github.com/ondras/rot.js/" target = "_ blank" rel = "noopener" > Rot. js y AnimASCII en la Página Web.

<script src="rot.min.js"></script>
<script src="animascii.js"></script>

Anime los caracteres ASCII almacenados en una matriz de JavaScript.

<div id="container1"></div>
var animation1 = new animascii({


src: [




["0-----", "-----0"],




["-0----", "----0-"],




["--0---", "---0--"],




["---0--", "--0---"],




["----0-", "-0----"],




["-----0", "0-----"]


],


display: document.getElementById("container1")
}

Anime los caracteres ASCII almacenados en un archivo de texto.

<div id="container2"></div>
var animation2 = new animascii({


src: "characters.txt",


display: document.getElementById("container2")
}

Ejecute una función cuando la animación esté completamente terminada.

var animation1 = new animascii({


src: [




["0-----", "-----0"],




["-0----", "----0-"],




["--0---", "---0--"],




["---0--", "--0---"],




["----0-", "-0----"],




["-----0", "0-----"]


],


display: document.getElementById("container1")
}, function() {


alert("Done!");
});

Configuración de la animación con las siguientes opciones.

var animation1 = new animascii({


src: [




["0-----", "-----0"],




["-0----", "----0-"],




["--0---", "---0--"],




["---0--", "--0---"],




["----0-", "-0----"],




["-----0", "0-----"]


],


display: document.getElementById("container1")


repeat: -1, // infinite loop


letter_padding: 1, // space between characters


font_family: "monospace",


font_size: 25,


background_color: "white",


foreground_color: "black",


delay: 200 // in milliseconds
}

Detenga la animación manualmente.

animation1.stop();

Te puede interesar: