.popup_hidden_bg {
transition: opacity .5s ease-out;
opacity: 0;
pointer-events: none;
/* 防止在隐藏时仍然能点击 */
}
@keyframes popupShop {
from {
transform: translateY(100%);
opacity: 0;
}
to {
transform: translateY(0);
opacity: 1;
}
}
@keyframes popupHidden {
from {
transform: translateY(0);
opacity: 1;
}
to {
transform: translateY(100%);
opacity: 0;
}
}
.openPopup {
animation: popupShop .5s forwards;
}
.hiddenPopup {
animation: popupHidden .5s forwards;
}