LLWiki正在建设中，欢迎加入我们！
“Widget:Sandbox”的版本间差异
跳转到导航
跳转到搜索
（//使用页面/文本对比查看器快速编辑） |
（//使用页面/文本对比查看器快速编辑） |
||
| （未显示同一用户的4个中间版本） | |||
| 第22行： | 第22行： | ||
.sif-nine, .sif-note { |
.sif-nine, .sif-note { |
||
position: absolute; |
position: absolute; |
||
top: 0; |
|||
bottom: 0; |
|||
left: 0; |
|||
right: 0; |
|||
z-index: -1; |
z-index: -1; |
||
} |
} |
||
#sif-canvas:hover .sif-note.pos1 { |
#sif-canvas:hover .sif-note.pos1 { |
||
animation: sif1 3s linear; |
animation: sif1 3s linear forwards; |
||
} |
} |
||
#sif-canvas:hover .sif-note.pos2 { |
#sif-canvas:hover .sif-note.pos2 { |
||
animation: sif2 3s linear; |
animation: sif2 3s linear forwards; |
||
} |
} |
||
#sif-canvas:hover .sif-note.pos3 { |
#sif-canvas:hover .sif-note.pos3 { |
||
animation: sif3 3s linear; |
animation: sif3 3s linear forwards; |
||
} |
} |
||
#sif-canvas:hover .sif-note.pos4 { |
#sif-canvas:hover .sif-note.pos4 { |
||
animation: sif4 3s linear; |
animation: sif4 3s linear forwards; |
||
} |
} |
||
#sif-canvas:hover .sif-note.pos5 { |
#sif-canvas:hover .sif-note.pos5 { |
||
animation: sif5 3s linear; |
animation: sif5 3s linear forwards; |
||
} |
} |
||
#sif-canvas:hover .sif-note.pos6 { |
#sif-canvas:hover .sif-note.pos6 { |
||
animation: sif6 3s linear; |
animation: sif6 3s linear forwards; |
||
} |
} |
||
#sif-canvas:hover .sif-note.pos7 { |
#sif-canvas:hover .sif-note.pos7 { |
||
animation: sif7 3s linear; |
animation: sif7 3s linear forwards; |
||
} |
} |
||
#sif-canvas:hover .sif-note.pos8 { |
#sif-canvas:hover .sif-note.pos8 { |
||
animation: sif8 3s linear; |
animation: sif8 3s linear forwards; |
||
} |
} |
||
#sif-canvas:hover .sif-note.pos9 { |
#sif-canvas:hover .sif-note.pos9 { |
||
animation: sif9 3s linear; |
animation: sif9 3s linear forwards; |
||
} |
} |
||
@ |
@keyframes sif1 { |
||
0% { |
|||
transform: none; |
transform: none; |
||
} |
} |
||
99% { |
|||
opacity: 1; |
|||
} |
|||
100% { |
|||
transform: translate(-150px, 0); |
transform: translate(-150px, 0); |
||
opacity: 0; |
|||
} |
} |
||
} |
} |
||
@ |
@keyframes sif2 { |
||
0% { |
|||
transform: none; |
transform: none; |
||
} |
} |
||
99% { |
|||
opacity: 1; |
|||
} |
|||
100% { |
|||
transform: translate(-138.582px, 57.403px); |
transform: translate(-138.582px, 57.403px); |
||
opacity: 0; |
|||
} |
} |
||
} |
} |
||
@ |
@keyframes sif3 { |
||
0% { |
|||
transform: none; |
transform: none; |
||
} |
} |
||
99% { |
|||
opacity: 1; |
|||
} |
|||
100% { |
|||
transform: translate(-106.066px, 106.066px); |
transform: translate(-106.066px, 106.066px); |
||
opacity: 0; |
|||
} |
} |
||
} |
} |
||
@ |
@keyframes sif4 { |
||
0% { |
|||
transform: none; |
transform: none; |
||
} |
} |
||
99% { |
|||
opacity: 1; |
|||
} |
|||
100% { |
|||
transform: translate(-57.403px, 138.582px); |
transform: translate(-57.403px, 138.582px); |
||
opacity: 0; |
|||
} |
} |
||
} |
} |
||
@ |
@keyframes sif5 { |
||
0% { |
|||
transform: none; |
transform: none; |
||
} |
} |
||
99% { |
|||
opacity: 1; |
|||
} |
|||
100% { |
|||
transform: translate(0, 150px); |
transform: translate(0, 150px); |
||
opacity: 0; |
|||
} |
} |
||
} |
} |
||
@ |
@keyframes sif6 { |
||
0% { |
|||
transform: none; |
transform: none; |
||
} |
} |
||
99% { |
|||
opacity: 1; |
|||
} |
|||
100% { |
|||
transform: translate(57.403px, 138.582px); |
transform: translate(57.403px, 138.582px); |
||
opacity: 0; |
|||
} |
} |
||
} |
} |
||
@ |
@keyframes sif7 { |
||
0% { |
|||
transform: none; |
transform: none; |
||
} |
} |
||
99% { |
|||
opacity: 1; |
|||
} |
|||
100% { |
|||
transform: translate(106.066px, 106.066px); |
transform: translate(106.066px, 106.066px); |
||
opacity: 0; |
|||
} |
} |
||
} |
} |
||
@ |
@keyframes sif8 { |
||
0% { |
|||
transform: none; |
transform: none; |
||
} |
} |
||
99% { |
|||
opacity: 1; |
|||
} |
|||
100% { |
|||
transform: translate(138.582px, 57.403px); |
transform: translate(138.582px, 57.403px); |
||
opacity: 0; |
|||
} |
} |
||
} |
} |
||
@ |
@keyframes sif9 { |
||
0% { |
|||
transform: none; |
transform: none; |
||
} |
} |
||
99% { |
|||
opacity: 1; |
|||
} |
|||
100% { |
|||
transform: translate(150px, 0); |
transform: translate(150px, 0); |
||
opacity: 0; |
|||
} |
} |
||
} |
} |
||
2022年4月21日 (四) 13:23的最新版本
|
这里是Widget沙盒，管理员用户可以使用以下预先准备的框架进行编辑测试。 |