Javascript 是否可以在ECS上保留卡片显示的方向？

我正在查看materializecss框架的card reveal组件，如图所示：官方文档如下：

对于我的应用程序，我已将

移到顶部，如下所示：

所以我想知道是否有可能使卡片显示动画从上到下，就像顶部的卡片内容是一个拉下来显示更多信息的窗帘一样

---

谢谢

您可以通过更改此元素的

transform

属性

.card.card-reveal{}

来实现这一点

我添加了

extra class

来更改

transform

属性，使最上面的卡片内容成为一个帘幕，可以拉下以显示更多信息*

这是工作代码

注意：还将

显示：block

添加到

.card.card图像img

修复演示中的

底部间隙


$（'.card content'）。单击（（）=>{
$（'.card-reveal'）.addClass（'card-closing'）；
});
$（'.card-reveal.card-title-custom'）。单击（（）=>{
$（'.card-reveal'）.removeClass（'card-closing'）；
});
.main{
宽度：450px；
利润率：30像素；
}
.card.card图像img{
边界半径：2×2×0；
位置：相对位置；
左：0；
右：0；
排名：0；
底部：0；
宽度：100%；
显示：块；
}
.卡片.卡片展示{
填充：20px；
位置：绝对位置；
背景色：#fff；
宽度：100%；
溢出y：自动；
最高：100%；
身高：100%；
z指数：1；
显示：块！重要；
转换：translateY（-200%）！重要；
转变：转变6s；
将改变：不透明度，变换；
}
.card.card-leaver.card-closing{
转换：translateY（-100%）！重要；
显示：块！重要；
}
.grey-text.text-darken-4{
显示：块；
光标：指针；
}

卡片标题摩尔垂直

卡片标题栏
以下是有关该产品的更多信息，仅在单击后才会显示

当然，您可以查看我的答案。