lipper
v0.4.4
Published
light weight ripple library
Downloads
22
Readme
lipper
light weight ripple library
Demo
Usage
script
<!doctype html>
<html>
<body>
<button id='btn'>Button Container</button>
<scirpt src='./lipper.min.js'></scirpt>
<scirpt>
lipper.init({selector: ['button', '.container']})
</scirpt>
</body>
</html>
ES6
import lipper from 'lipper'
lipper.init({
selector: ['button', '.container']
})
API
lipper.init(option)
: Initializationlipper.put(option)
: Set parameters. Same asinit
lipper.reset()
: Reset defaultoption
lipper.destroy()
: Remove event listener
option
|parameter name|default value|Required|detail|
|-----|-----|-----|---|
|selector|--|yes|CSS selector. String or string array.|
|duration|1.5
|no|Duration. The unit is second.|
|radius|50
|no|Diffusion radius. The unit is px|
|color|rgba(250, 250, 250, .5)
|no|The color of lipper|
|center|false
|no|Whether lipper in the container|
|overflow|false
|no|Whether to continue lipper outside the container|
|zindex|1000
|no|z-index
value|