pscmholb5
/
library_manage_system
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

注释he

Browse Source
branch_he
HeJiaYan 8 months ago
parent dd1da4d918
commit 8501051250
1 changed files with 139 additions and 152 deletions
Show Stats Download Patch File Download Diff File

291
WebContent/public/css/animate.css vendored
Unescape View File

@ -2898,249 +2898,236 @@
} }
} }
/* 定义一个名为zoomInDown的关键帧动画 */
@keyframes zoomInDown { @keyframes zoomInDown {
/* 动画开始时的状态 */
from { from {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); /* 缩小并向上移动 */
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0); /* 缩小并向上移动 */
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
} }
/* 动画进行到60%时的状态 */
60% { 60% {
opacity: 1; opacity: 1; /* 完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); /* 放大并向下移动 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0); /* 放大并向下移动 */
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
} }
} }
/* 应用zoomInDown动画的类 */
.zoomInDown { .zoomInDown {
-webkit-animation-name: zoomInDown; -webkit-animation-name: zoomInDown; /* 使用WebKit内核的浏览器 */
animation-name: zoomInDown; animation-name: zoomInDown; /* 使用标准内核的浏览器 */
} }
/* 定义一个名为zoomInLeft的关键帧动画（适用于WebKit内核） */
@-webkit-keyframes zoomInLeft { @-webkit-keyframes zoomInLeft {
/* 动画开始时的状态 */
from { from {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); /* 缩小并向左移动 */
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); /* 缩小并向左移动 */
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
} }
/* 动画进行到60%时的状态 */
60% { 60% {
opacity: 1; opacity: 1; /* 完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); /* 放大并向右移动 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); /* 放大并向右移动 */
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
} }
} }
/* 定义一个名为zoomInLeft的关键帧动画（适用于标准内核） */
@keyframes zoomInLeft { @keyframes zoomInLeft {
/* 动画开始时的状态 */
from { from {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); /* 缩小并向左移动 */
transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(-1000px, 0, 0); /* 缩小并向左移动 */
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
} }
/* 动画进行到60%时的状态 */
60% { 60% {
opacity: 1; opacity: 1; /* 完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); /* 放大并向右移动 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(10px, 0, 0); /* 放大并向右移动 */
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
} }
} }
/* 应用zoomInLeft动画的类 */
.zoomInLeft { .zoomInLeft {
-webkit-animation-name: zoomInLeft; -webkit-animation-name: zoomInLeft; /* 使用WebKit内核的浏览器 */
animation-name: zoomInLeft; animation-name: zoomInLeft; /* 使用标准内核的浏览器 */
} }
/* 定义一个名为zoomInRight的关键帧动画（适用于WebKit内核） */
@-webkit-keyframes zoomInRight { @-webkit-keyframes zoomInRight {
/* 动画开始时的状态 */
from { from {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); /* 缩小并向右移动 */
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); /* 缩小并向右移动 */
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
} }
/* 动画进行到60%时的状态 */
60% { 60% {
opacity: 1; opacity: 1; /* 完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); /* 放大并向左移动 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); /* 放大并向左移动 */
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
} }
} }
/* 定义一个名为zoomInRight的关键帧动画 */
@keyframes zoomInRight { @keyframes zoomInRight {
/* 动画开始时的状态 */
from { from {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); /* 缩小并向右移动 */
transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(1000px, 0, 0); /* 缩小并向右移动 */
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
} }
/* 动画进行到60%时的状态 */
60% { 60% {
opacity: 1; opacity: 1; /* 完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); /* 放大并向左移动 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(-10px, 0, 0); /* 放大并向左移动 */
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
} }
} }
/* 应用zoomInRight动画的类 */
.zoomInRight { .zoomInRight {
-webkit-animation-name: zoomInRight; -webkit-animation-name: zoomInRight; /* 指定动画名称 */
animation-name: zoomInRight; animation-name: zoomInRight; /* 指定动画名称 */
}
@-webkit-keyframes zoomInUp {
from {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
60% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
} }
/* 定义一个名为zoomInUp的关键帧动画 */
@keyframes zoomInUp { @keyframes zoomInUp {
/* 动画开始时的状态 */
from { from {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); /* 缩小并向下移动 */
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 1000px, 0); /* 缩小并向下移动 */
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
} }
/* 动画进行到60%时的状态 */
60% { 60% {
opacity: 1; opacity: 1; /* 完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); /* 放大并向上移动 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); /* 放大并向上移动 */
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
} }
} }
/* 应用zoomInUp动画的类 */
.zoomInUp { .zoomInUp {
-webkit-animation-name: zoomInUp; -webkit-animation-name: zoomInUp; /* 指定动画名称 */
animation-name: zoomInUp; animation-name: zoomInUp; /* 指定动画名称 */
}
@-webkit-keyframes zoomOut {
from {
opacity: 1;
}
50% {
opacity: 0;
-webkit-transform: scale3d(0.3, 0.3, 0.3);
transform: scale3d(0.3, 0.3, 0.3);
}
to {
opacity: 0;
}
} }
/* 定义一个名为zoomOut的关键帧动画 */
@keyframes zoomOut { @keyframes zoomOut {
/* 动画开始时的状态 */
from { from {
opacity: 1; opacity: 1; /* 完全不透明 */
} }
/* 动画进行到50%时的状态 */
50% { 50% {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale3d(0.3, 0.3, 0.3); -webkit-transform: scale3d(0.3, 0.3, 0.3); /* 缩小 */
transform: scale3d(0.3, 0.3, 0.3); transform: scale3d(0.3, 0.3, 0.3); /* 缩小 */
} }
/* 动画结束时的状态 */
to { to {
opacity: 0; opacity: 0; /* 完全透明 */
} }
} }
/* 应用zoomOut动画的类 */
.zoomOut { .zoomOut {
-webkit-animation-name: zoomOut; -webkit-animation-name: zoomOut; /* 指定动画名称 */
animation-name: zoomOut; animation-name: zoomOut; /* 指定动画名称 */
}
@-webkit-keyframes zoomOutDown {
40% {
opacity: 1;
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0);
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
}
to {
opacity: 0;
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0);
-webkit-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
}
} }
/* 定义一个名为zoomOutDown的关键帧动画 */
@keyframes zoomOutDown { @keyframes zoomOutDown {
/* 动画进行到40%时的状态 */
40% { 40% {
opacity: 1; opacity: 1; /* 完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); /* 放大并向上移动 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(0, -60px, 0); /* 放大并向上移动 */
-webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); -webkit-animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); /* 缓动函数 */
} }
/* 动画结束时的状态 */
to { to {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); -webkit-transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); /* 缩小并向下移动 */
transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); transform: scale3d(0.1, 0.1, 0.1) translate3d(0, 2000px, 0); /* 缩小并向下移动 */
-webkit-transform-origin: center bottom; -webkit-transform-origin: center bottom; /* 变换原点在底部中心 */
transform-origin: center bottom; transform-origin: center bottom; /* 变换原点在底部中心 */
-webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); -webkit-animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1); /* 缓动函数 */
} }
} }
/* 应用zoomOutDown动画的类 */
.zoomOutDown { .zoomOutDown {
-webkit-animation-name: zoomOutDown; -webkit-animation-name: zoomOutDown; /* 指定动画名称 */
animation-name: zoomOutDown; animation-name: zoomOutDown; /* 指定动画名称 */
} }
@-webkit-keyframes zoomOutLeft { /* 定义一个名为zoomOutLeft的关键帧动画 */
@keyframes zoomOutLeft {
/* 动画进行到40%时的状态 */
40% { 40% {
opacity: 1; opacity: 1; /* 完全不透明 */
-webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); -webkit-transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); /* 放大并向右移动 */
transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); transform: scale3d(0.475, 0.475, 0.475) translate3d(42px, 0, 0); /* 放大并向右移动 */
} }
/* 动画结束时的状态 */
to { to {
opacity: 0; opacity: 0; /* 完全透明 */
-webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); -webkit-transform: scale(0.1) translate3d(-2000px, 0, 0); /* 缩小并向左移动 */
transform: scale(0.1) translate3d(-2000px, 0, 0); transform: scale(0.1) translate3d(-2000px, 0, 0); /* 缩小并向左移动 */
-webkit-transform-origin: left center; -webkit-transform-origin: left center; /* 变换原点在左侧中心 */
transform-origin: left center; transform-origin: left center; /* 变换原点在左侧中心 */
} }
} }
/* 应用zoomOutLeft动画的类 */
.zoomOutLeft {
-webkit-animation-name: zoomOutLeft; /* 指定动画名称 */
animation-name: zoomOutLeft; /* 指定动画名称 */
}
/* 定义一个名为zoomOutLeft的关键帧动画 */ /* 定义一个名为zoomOutLeft的关键帧动画 */
@keyframes zoomOutLeft { @keyframes zoomOutLeft {
/* 在动画的40%时 */ /* 在动画的40%时 */

Write Preview
Loading…
Cancel
Save