Author: | colealanroberts |
---|---|
Views Total: | 480 views |
Official Page: | Go to website |
Last Update: | November 27, 2018 |
License: | MIT |
Preview:

Description:
Ghost.js is a small JavaScript library that reveals or prints any strings with slide/fade/flip animation on page load.
How to use it:
Import the Ghost library’s files into the html document.
<link href="ghost.css" rel="stylesheet"> <script src="ghost.js"></script>
Initialize the Ghost and specify the target container to reveal or print the text.
let ghost = new Ghost({ selector: '#example' });
Customize the text to reveal/print on page load.
let ghost = new Ghost({ selector: '#example', text: 'CSSSCRIPT.COM' });
Set the animation type you want to use.
- flipIn
- slideDown or slideUp
- fadeIn
let ghost = new Ghost({ selector: '#example', text: 'CSSSCRIPT.COM', animation: 'slideDown' });
Set the effect you want to display the text.
- reveal
- typewriter
let ghost = new Ghost({ selector: '#example', text: 'CSSSCRIPT.COM', effect: 'reveal' });
Config the interval & delay in milliseconds.
let ghost = new Ghost({ selector: '#example', text: 'CSSSCRIPT.COM', interval: 100, delay: 400 });