遮罩浮现 | wjs-css-effects

主视觉区域

详细信息标题

悬停时从底部滑入，展示补充说明内容。

关键点

底部信息揭示效果在 hover 时从卡片底部滑出信息层，展示更多内容
信息层初始位置 transform: translateY(100%) 完全隐藏在容器下方
hover 时 translateY(0) 回到原位，从下往上滑入揭示内容
外层容器必须 overflow: hidden，隐藏信息层在容器外的部分
配合半透明背景和 transition 过渡，让揭示过程柔和不突兀

效果说明

底部信息遮罩从下浮现。遮罩层默认通过 translateY(100%) 藏在容器底部下方，hover 时滑回原位 (translateY(0))。容器 overflow: hidden 裁剪滑入过程，呈现"从底部冒出"的效果。适合图片卡片展示补充信息，避免信息过载。