1.0.6 • Published 3 years ago
motorcortex-comets
Demo
Check it out here
Installation
$ npm install --save @kissmybutton/motorcortex-comets
# OR
$ yarn add @kissmybutton/motorcortex-comets
Loading
const MotorCortex = require("@kissmybutton/motorcortex/");
const cometsDefinition = require("@kissmybutton/motorcortex-comets");
const Plugin = MotorCortex.loadPlugin(BannersDefinition);
Create incident
Comets
const comet = new MyPlugin.Comets({
width: 800,
height: 300,
cometMaxSize:581,
cometMinSize:200,
meteoriteColors:["#FFFFFF","#FFDC63"],
auraIner:["#57DDBA","#62D8B9","#7CC8B3"],
auraOuter:["#47F7C5","#87B3C1"],
items: 3,
repeats:5,
duration:8000
}, {
selector: '.comet1',
});
Comets Attrs
Name | Are | Values |
---|
width | width of incident | num |
height | height of incident | num |
cometMaxSize | the maximum size of comets | num |
cometMinSize | the minimum size of comets | num |
meteoriteColors | The list of colors of meteorite | array of colors |
auraIner | The list of colors for the iner aura | array of colors |
auraOuter | The list of colors for the iner aura | array of colors |
items | how meny commet will fall | num |
repeats | how meny times clip wiil loop | num |
duration | max duration of one comet fall | num |
Stars
const stars = new MyPlugin.Stars({
width: 800,
height: 300,
starMaxSize:60,
starMinSize:15,
starColor: "#F0F0F0",
starGlowColor:"0 0 0 0 0.950946003 0 0 0 0 0.81265567 0 0 0 0 0.51528336 0 0 0 1 0",
items: 15,
repeats:5,
duration:8000
}, {
selector: '.comet2',
});
Stars Attrs
Name | Are | Values |
---|
width | width of incident | num |
height | height of incident | num |
starMaxSize | the maximum size of each start | num |
starMinSize | the minimum size of each start | num |
starColor | the color of a star | color |
starGlowColor | the color of star clow | sting of ColorMatrix value |
items | start number | num |
repeats | how meny times clip wiil loop | num |
duration | max duration of one full blinking animation | num |