Html 在Resact slick幻灯片中悬停缩放图像幻灯片

我正在使用react slick渲染图像幻灯片。我想缩放悬停时的图像，并将其显示在滑块前面。然而，即使我尝试使用

z-index

，它也不起作用。图像的顶部和底部仍然被切断

我的CSS：

#新游戏幻灯片img{
宽度：140px；
高度：150像素；
保证金：自动；
}
#新游戏幻灯片：悬停{//My image on hover
转变：转变2；
转换：比例（1.5）；
z指数：2；
}

---

如果您包含HTML标记和所有影响幻灯片放映的CSS，这将非常有用。