Dom Flowt is a lightweight JavaScript Library for performing animations on elements as they appear into a users view
Get StartedDownload Dom Flowt now and get started making your website more fun and interactive!
There are no new versions of Dom Flowt in development at the moment. Please visit us often for updates.
Before you start, make sure you have downloaded the ZIP folder and added the files to your project.
Make sure you have referenced the CSS file.
Make sure you have referenced the JS file.
Add the watch method inside the "scroll" event listener on the element of your choice. Normally you would add the watch method to your window element.
And there you go, Dom Flowt should work on your application.
View all attributes used in the latest version of the Dom Flowt library.
Dom Flowt uses the "is visible" attribute to determine whether the element is visible on screen or not.
This attribute is required for all elements and must be given the value of false.
The type attribute is used to specify what type of animation should be used when the element animates on screen.
Default Value: "fade"
The duration attribute is used to specify the duration of the animation.
The time is measured in milliseconds
Default Value: "500"
The delay attribute is used to specify the duration of the delay the animation must have.
The time is measured in milliseconds
Default Value: "0"
The repeat attribute is used to specify whether the animation should happen again when the element appears on screen more than once.
To prevent repeat behaviour, add the repeat attribute and give it the value of "no-repeat"
Default Value: "repeat"
View all animation types used in the latest version of the Dom Flowt library
The "fade" type currently does not have any variants.
The "pop" type currently supports 2 variants
The "float" type currently supports 4 variants
The "flip" type currently supports 2 variants
The "jump" type currently does not have any variants.
Dom Flowt was made for developers to easily use and extend or modify it.
The Dom Flowt library requires you to reference the JS and CSS files into your project and call one method for it to work!
Adding new animation types in Dom Flowt can be done with CSS alone! No need to edit any of the JavaScript!
This library is specific to just animating elements when they come into a users view, it is not bloated with other functionalities!
