style.css:修订间差异
模板页面
更多操作
![]() OctoberSama(留言 | 贡献) (创建页面,内容为“@keyframes scaleIn { from { transform: scale(0.5); opacity: 0; } to { transform: scale(1); opacity: 1; } } .popup-image { animation: scaleIn 0.3s ease forwards; }”) |
![]() OctoberSama(留言 | 贡献) 小 |
||
(未显示同一用户的39个中间版本) | |||
第1行: | 第1行: | ||
@keyframes | @keyframes zoomThenHide { | ||
0% { | |||
opacity: 0; | opacity: 0; | ||
transform: translate(-50%, -50%) scale(0.1); | |||
} | } | ||
20% { | |||
opacity: 1; | opacity: 1; | ||
transform: translate(-50%, -50%) scale(3); | |||
} | } | ||
86.7% { | |||
opacity: 1; | |||
transform: translate(-50%, -50%) scale(3); | |||
} | |||
100% { | |||
opacity: 0; | |||
transform: translate(-50%, -50%) scale(0); | |||
} | |||
} | |||
.zoom-fullscreen { | |||
position: fixed !important; | |||
top: 50% !important; | |||
left: 50% !important; | |||
width: auto !important; | |||
height: auto !important; | |||
max-width: 100vw !important; | |||
max-height: 100vh !important; | |||
object-fit: contain !important; | |||
transform: translate(-50%, -50%) scale(0.1); | |||
animation: zoomThenHide 1.5s ease-out forwards; | |||
z-index: 99999 !important; | |||
display: block !important; | |||
} | |||
.mw-collapsible.mw-collapsed .zoom-fullscreen { | |||
visibility: hidden; | |||
opacity: 0; | |||
} | } | ||
. | .mw-collapsible:not(.mw-collapsed) .zoom-fullscreen { | ||
visibility: visible; | |||
opacity: 1; | |||
} | } |
2025年6月21日 (六) 00:38的最新版本
@keyframes zoomThenHide {
0% {
opacity: 0;
transform: translate(-50%, -50%) scale(0.1);
}
20% {
opacity: 1;
transform: translate(-50%, -50%) scale(3);
}
86.7% {
opacity: 1;
transform: translate(-50%, -50%) scale(3);
}
100% {
opacity: 0;
transform: translate(-50%, -50%) scale(0);
}
}
.zoom-fullscreen {
position: fixed !important;
top: 50% !important;
left: 50% !important;
width: auto !important;
height: auto !important;
max-width: 100vw !important;
max-height: 100vh !important;
object-fit: contain !important;
transform: translate(-50%, -50%) scale(0.1);
animation: zoomThenHide 1.5s ease-out forwards;
z-index: 99999 !important;
display: block !important;
}
.mw-collapsible.mw-collapsed .zoom-fullscreen {
visibility: hidden;
opacity: 0;
}
.mw-collapsible:not(.mw-collapsed) .zoom-fullscreen {
visibility: visible;
opacity: 1;
}