Skip to content

Draw SVG lightning bolts on to any element, creating a flash effect.

License

Notifications You must be signed in to change notification settings

guggero/light-it-up

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

light-it-up

Draw SVG lightning bolts on to any element, creating a flash effect.

Usage

Just add the library and call the flash function:

<html style="height: 100%">
<head>
  <script src="https://raw.githubusercontent.com/guggero/light-it-up/master/index.js"></script>
</head>
<body>
<button onclick="flash({duration: 500})">Flash for 0.5s</button>
</body>
</html>

Have a look at the demo too

Options:

{
  element: document.getElementById('foo'), // element to render into, default: document.body
  duration: 1000, // duration of flash effect in milliseconds, default 800
  zIndex: 9999, // CSS property 'z-index' of the inserted <div>, default 1000
  colorFlash: '#ffffff', // color of the flash, default rgba(255, 255, 255, 1)
  colorBlur: '#333333', // color of the blur effect, default rgba(192, 192, 255, 1)
}

Credits

This code was initially written by robtex for moneni.com and was refactored into an NPM library with his permission.

About

Draw SVG lightning bolts on to any element, creating a flash effect.

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published