dos e0005 motionData - cwtickle/danoniplus-docs GitHub Wiki
English | Japanese
^ Return to Screen effects specification
| < CSS skin change | Arrow and freeze-arrow motion | Key types change > |
Arrow and freeze-arrow motion ( arrowMotion_data, frzMotion_data )
Overview
- Sets the animation to be added to the arrow and freeze arrow.
Usage
|arrowMotion_data=
300,20,toRight,toLeft
900,20,none
|
|frzMotion_data=
300,20,toRight,toLeft
900,20,
|
|arrowMotion2_data=...|
|arrowMotion3_data=arrowMotion2_data| // The third chart is a copy of the data of the second chart
One set of four. "arrowMotion_data" is for arrows and "frzMotion_data" is for freeze arrows. Both have different names, but the usage is the same.
Descriptive specification
No | Logical name | Example | Description |
---|---|---|---|
1 | Frame | 200 | Specifies the number of timing frames to be changed. |
2 | ColorNo | 20 | Specify the object (arrow number) to be changed, such as an arrow or freeze arrow. See below. |
3 | styleName | toRight | CSS class name describing animation attribute (for upward scrolling)*. |
4 | styleName | toLeft | CSS class name describing animation attribute (for downward scrolling)*. |
*It can be omitted. To remove the motion, specify none
or leave it empty.
If you specify the third CSS class name and omit the fourth CSS class name, both will be the third CSS class.
Arrow number
The color change specifies an arrow number indicating the target. The specifications are as follows.
Arrow Number | Logical name | Description |
---|---|---|
0-19 or1000- | Arrows (individual) | Specifies how many arrows are in the step zone when arranged in left-to-right and top-to-bottom order. Starts at 0. Used to apply arrows individually. Pattern 0 for each key is the standard. Other patterns are automatically selected in the source. |
20-24 | Arrow groups 1-5 | Set the arrow group specified by "setColor" from 1 to 5. |
About the CSS class to be specified
- Specify the corresponding CSS class in the CSS file.
- The CSS class should be a CSS class with attributes related to animation.
However, the
animation-duration
attribute is automatically set and does not need to be set. - For keyframes that you set, make sure that the coordinate position becomes the original position (
translateX
andtranslateY
are0px
respectively) at the end of the keyframes (100%).
/* CSS class specified by motionData */
.toSpin {
animation-name: spinY;
}
/* Y axis rotation */
@keyframes spinY {
0% {
transform: rotateY(0deg);
}
100% {
transform: rotateY(360deg);
}
}
Related pages
- displayUse :pencil: Availability of Display item, initial value setting
Changelog
Version | Change details |
---|---|
v34.0.0 | - Added the ability to combine individual arrow and freeze-arrow motion settings while referencing data from other charts. |
v31.2.0 | - Added the ability to specify the data name of another arrow or freeze-arrow motion to refer to the settings of that data name. |
v26.0.0 | - Support for dummy arrow and freeze arrow motion change (usage is the same as normal) |
v21.0.0 | - Support for more than 20 keys |
v7.0.0 | - Initial implementation |
| < CSS skin change | Arrow and freeze-arrow motion | Key types change > |