User:OctoberSama/跳脸/style.css
< User:OctoberSama | 跳脸
注意：在保存之后，您可能需要清除浏览器缓存才能看到所作出的变更的影响。
- Firefox/Safari：按住“Shift”的同时单击“刷新”，或按“Ctrl-F5”或“Ctrl-R”（Mac为“⌘-R”）
- Google Chrome：按“Ctrl-Shift-R”（Mac为“⌘-Shift-R”）
- Internet Explorer：按住“Ctrl”的同时单击“刷新”，或按“Ctrl-F5”
- Opera：在“工具→首选项”中清除缓存
- 如果您已登录但该页面出现未登录状态，请尝试在地址栏的地址最后添加代码
?_=1来访问最新页面。 - 添加代码后的本页地址如下：
-{R|https://moegirl.icu/User:OctoberSama/%E8%B7%B3%E8%84%B8/style.css?_=1}-
/* 折叠状态下隐藏动画容器，避免页面加载时闪现 */
.mw-collapsible.mw-collapsed .zoom-fullscreen {
visibility: hidden;
opacity: 0;
}
/* 折叠展开时显示图片 */
.mw-collapsible:not(.mw-collapsed) .zoom-fullscreen {
visibility: visible;
opacity: 1;
}
/* 图片动画及布局 */
.zoom-fullscreen {
position: fixed !important;
top: 50% !important;
left: 50% !important;
margin-top: -50vh !important; /* 负一半视口高度，粗略居中 */
margin-left: -50vw !important; /* 负一半视口宽度，粗略居中 */
width: auto !important;
height: auto !important;
max-width: 100vw !important;
max-height: 100vh !important;
object-fit: contain !important;
transform: scale(0.1);
animation: zoomThenHide 1.5s ease-out forwards;
z-index: 99999 !important;
display: block !important;
}
/* 动画关键帧 */
@keyframes zoomThenHide {
0% {
opacity: 0;
transform: scale(0.1);
}
20% {
opacity: 1;
transform: scale(3);
}
86.7% {
opacity: 1;
transform: scale(3);
}
100% {
opacity: 0;
transform: scale(0);
}
}