悬浮时从底层图像触发的透明叠加图像

Question

我有许多图像在悬停时展开，它们都有一个展开图标，当直接悬停在上面时，使用不透明度消失：0;。 理想情况下，当我将鼠标悬停在图像中的任何位置时，我试图让此图标消失，以便在图像完全展开时不显示。 在任何帮助之前，轻松简单的解决方案将是理想的。

Answer 1

使用js你可以试试这个：

$(".step1 img").hover(
    function(){
        $(this).parent().find(".image-overlay").fadeOut(400);
    },
    function(){
        $(this).parent().find(".image-overlay").fadeOut(400);
    }
);

或者替代fadeOut / fadeIn你可以使用toggleClass或addClass

用css你可以试试这个

.step1:hover .image-overlay {
    opacity: 0;
}