1

我正在创建一个插图作品集网站,并使用 CSS 过渡来放大框以显示详细的工作缩略图。

但是我很挣扎,因为当我将鼠标悬停在缩略图上时,它们似乎总是像这样彼此落后:demo

我需要他们走在前面,这样用户才能看到图像的细节。

我有所有的结构,我只是不能说出我做错了什么让他们落后于自己。

任何帮助将不胜感激。

这是缩放效果的代码!

scale {
-webkit-transition: all .5s ease;
-moz-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease; 

}

.scaleMe:hover {
transform: scale(1.2);
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
-o-transform: scale(1.2);
-moz-transform: scale(1.2);
-webkit-box-shadow: 3px 3px 3px #666666;
-moz-box-shadow: 3px 3px 3px #666666;
-o-box-shadow: 3px 3px 3px #666666;
box-shadow: 3px 3px 3px #666666;

}

4

1 回答 1

1
.scaleMe:hover {
    z-index: 1;
}

提供较高的z-index会将其推到较低的 z-index 元素上。默认值为 0。小提琴

于 2014-04-08T17:40:27.770 回答