简单的悬停效果不适用于移动 Safari

Question

我正在尝试使用 html 网站中的一些图像制作简单的悬停效果。 计划是：当您将鼠标悬停在图像上时，会出现图像阴影和一些细节。 css代码是这样的。

   /* Hover overs */ 

.folio4:hover .face { 
    opacity:1;
   cursor: pointer; 
}                                                                           
.folio4:hover img {
   opacity: 1; 
}
.folio4:hover h2 {
    opacity: 1;

}

.folio4:hover a.icon {
    opacity:1;
    transform: translateY(75px); 
    -webkit-transform: translateY(75px);
    -o-transform: translateY(75px);
    -ms-transform: translateY(75px);
    transition: 500ms;
    -webkit-transition: 500ms;
    -o-transition: 500ms;
    -ms-transition: 500ms;

}

.folio4:hover a.icon2 { 
    transition: 500ms;
    -webkit-transition: 500ms;
    -o-transition: 500ms;
    -ms-transition: 500ms;
    transform: translateY(75px); 
    -webkit-transform: translateY(75px);
    -o-transform: translateY(75px);
    -ms-transform: translateY(75px);
    opacity: 1; 

}

它适用于所有浏览器，除了移动版 Safari。我该怎么做才能使它起作用？ 提前感谢您的每一个回答。

Answer 1

据我所知，悬停效果无法在移动设备上使用，因为系统看不到悬停效果，正如您在计算机上所知道的那样。 您唯一能做的就是将悬停效果设置为仅针对页面的响应式设计的点击效果，因此用户必须点击图片并获取详细信息。 抱歉，如果这不是解决方案