After that, all you have to do is naming the class of the div you want to blur to either the blurjs or fadejs class, you can mix it with your current classes as well by separating those with spaces, like so:
<div id="yourId" class="someClass blurjs"></div>
<div id="yourId" class="fadejs someClass"></div>
Maintatining opacity with fadejs
If your elements require opacity (alpha channel), you can achieve that with fadejs by adding the fadejs-data property to your animated elements, like so:
Note that in this example the opacity will be 60% but the syntax is between 0-1 (like CSS).
The dynamic method
The dynamic method requires the same script linking as the simple method shown above.
This method will allow you to dynamically blur the objects even if they won’t load with the page itself, to achieve this just add this img tag inside the div you want to blur, like so:
After that, all you have to do is naming the class of the element you want to blur to either the blurjs or fadejs class, you can mix it with your current classes as well by separating those with spaces, like so:
MotionBlurJS will duplicate your objects so they can get blurred or faded on runtime, the DOM will only show the necessary objects (no pesky img tags) in order for it to work properly the blurred object has to be positioned absolutely and to be animated with CSS animation
This code is under active development, if you experience any bugs or kinks, feel free to report those through Github or by mail: firstname.lastname@example.org please mention which method you were using and if possible, send me your code snippets, Happy coding !