【问题标题】: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: relativeposition: absolute
  • @Morpheus,我试过了
  • 不好意思,我没看到你用display: flex,所以第一条评论无效。

标签: css image hover zooming


【解决方案1】:

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

1)

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

2)

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

【讨论】:

    【解决方案2】:
    .tcb-flex-col.tve_empty_dropzone:hover {
        z-index: 9999999;
    }
    

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

    【讨论】:

    • 没问题,看起来不错:)
    猜你喜欢
    • 2016-02-12
    • 2014-05-07
    • 1970-01-01
    • 2016-06-25
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多