在侧面 div 上缩放图像答案

【问题标题】：Zoom image over side divs在侧面 div 上缩放图像
【发布时间】：2017-12-27 16:22:18
【问题描述】：

我正在创建这个登录页面：https://oakfield.online/

为了更加关注图像，我尝试在鼠标悬停时创建缩放效果。目标实现了 50%，我唯一不能做的就是让 img 标记位于该图像旁边的列的顶部。

这是结果：

img 有我的 css 悬停代码：

.box-imagem img:hover {
    z-index: 999999;
    transform:scale(1.1);
    -ms-transform:scale(1.1); /* IE 9 */
    -moz-transform:scale(1.1); /* Firefox */
    -webkit-transform:scale(1.1); /* Safari and Chrome */
    -o-transform:scale(1.1); /* Opera */
}

关于什么应该起作用的任何想法？

谢谢！

【问题讨论】：

z-index 不适用于position: static（默认位置）。使用position: relative 或position: absolute
@Morpheus，我试过了
不好意思，我没看到你用display: flex，所以第一条评论无效。

标签： css image hover zooming

【解决方案1】：

你可以通过两种方式做到这一点

.tcb-flex-col>.tve_empty_dropzone:hover {
        z-index: 9999999;
    }

.tcb-flex-col.tve_empty_dropzone:hover {
        z-index: 9999999;
    }

【讨论】：

【解决方案2】：

.tcb-flex-col.tve_empty_dropzone:hover {
    z-index: 9999999;
}

玩这个 - 你的容器正在为 powerrrrr 而战。 :)

【讨论】：

没问题，看起来不错:)