A set of animated icons + code to insert them into the webpages
A set of animated icons + code to insert them into the webpages
A collection of animated icons + javascript library.
You can install it either via CDN or npm.
Insert this string to your HTML head:
<script src="https://cdn.jsdelivr.net/gh/icons8/titanic@master/dist/js/titanic.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/4.5.9/bodymovin.min.js"></script>
And initialize it before the body closes:
<script>
var titanic = new Titanic();
</script>
This way, you can add icons anywhere in your HTML using this tag:
Where chat can be any of these:
If you'd like to host your images on your server instead of rawgit, pass the base URL with the init() function:
titanic.begin('/my/base/directory/');
Then, if you have a div with id="chat", Titanic will search for icons in /my/base/directory/chat.json.
npm install titanic-icons --save
titanic.isInitialized() -- just true/false flag
titanic.items -- list of titanic items
titanic.items[index].on(), titanic.items[index].off(), titanic.items[index].play() -- play animations of the titanic item by index
titanic.on(token), titanic.off(token), titanic.play(token) -- play animations of the titanic item by token (name)
<head>
<script src="https://cdn.jsdelivr.net/gh/icons8/titanic@master/dist/js/titanic.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bodymovin/4.5.9/bodymovin.min.js"></script>
</head>
<body>
<script>
var titanic = new Titanic({
hover: true, // auto animated on hover (default true)
click: true // auto animated on click/tap (default false)
});
</script>
<button onclick="titanic.on(getElementById('checkbox').value)">On</button>
</body>
Titanic is made by Icons8 — icons, illustrations, photos, music, and AI tools for designers and developers.
JavaScript is basically bodymovin plus few lines of my code. It's a solid library with an awesome name. Thank you, guys.
Icons are created by Margarita Ivanchikova from Icons8. She has many more awesome animations in her portfolio.
The code rewritten by Denis Alexanov, my teacher and guru. Thank you!
Project is produced by Icons8, author of the famous icon library, IconPharm, and Sleek Logos.
Yours, Ivan Braun from Argentinian shelter.
No open issues yet, or sync has not completed.