Fancy animations are a dime a dozen on the web. They’re getting easier to create with tons of incredible animation libraries. Cascade.js is one more library to add to the list, and it’s definitely a unique one. With Cascade, you can design custom animation effects using cascading letters in text or cascading elements in a main container. This library has no dependencies; it runs on classic JavaScript. You can install it through npm, Bower, or by downloading a copy right from GitHub. Read Also: 30 Cool CSS Animations You Have To See To get CascadeJS working, you’ll need two files: a CSS file and a JavaScript file. They both come packaged with minified versions to save you a few KBs on page size. Each Cascade element gets broken down into separate parts which animate individually through But, you will need to set up the You can actually use jQuery with this library if you want, however it’s not required. So, if you prefer selecting elements with jQuery then feel free to use that instead. Here’s a snippet of vanilla JavaScript from the main site’s demo: <script> var element = document.getElementsByTagName('h1')[0]; var cascade = new Cascade(element).flow(); </script> You can pass the CascadeJS has another function called All code samples are openly available on the main library page, so you can copy/paste and tinker on your own. But, you’ll also find the documentation on the GitHub page if you’re looking for a clearer way to get started. Read Also: 10 CSS3 Animation Tools You Should Bookmark from http://www.hongkiat.com/blog/build-cascading-animations-cascadejs/
0 Comments
Leave a Reply. |