Motion Blur Effect In JavaScript – MotionBlurJS

MotionBlurJS is a vanilla JavaScript library that applies a motion blur effect to any elements using JavaScript and CSS animation-delay property.

Also works with SVG objects and SVG files.

How to use it:

Download and insert the blur.js library into the html page.

<script src="blur.js"></script>

Apply a basic motion blur effect to an element.

<div id="element" class="blurjs"></div>

Apply fade and motion blue effects to an element.

<div id="element" class="fadejs"></div>

To apply the motion blur effect to SVG, make sure to load the blurSVG.js library instead.

<script src="blurSVG.js"></script>

Changelog:

05/05/2024

• Updated blur.js