css上下动画 和淡化
.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;
}
原文地址：https://blog.csdn.net/ssorth/article/details/140654324
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！