请我想将鼠标悬停在特定的 Div 上，当我这样做时，特定的隐藏显示的一面和另一个显示，但问题是所有的 div 都同时隐藏和显示。
$(".service").on('mouseover', function () {
$(".face1").fadeOut();
$(".face2").fadeIn();
});
$(".service").on('mouseout', function () {
$(".face2").fadeOut();
$(".face1").fadeIn();
});
您最常$(this)用来阻止所有具有相同类名的元素.face1并.face2执行相同的操作，并防止受同一事件的影响。
查询：
$(".service").on('mouseenter', function () {
$(this).find(".face1").fadeOut();
$(this).find(".face2").fadeIn();
});
$(".service").on('mouseleave', function () {
$(this).find(".face2").fadeOut();
$(this).find(".face1").fadeIn();
});
基于 OP 的更新询问：
CSS :
.service .face2 {position:absolute;top:50%;left:50%;display:none;transform:translate3d(-50%,-50%,0);text-align:center;}
将此添加到 css 文件的最后一行。jsfiddle（仅用于过渡目的）
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句