Question

我有一个wordpress网站，我正在帮助一个朋友

将鼠标悬停在图库图像上时，会显示带有更多按钮的透明红色图像。它在chrome，IE，Firefox中运行良好，但是当我在iphone和Ipads上尝试使用safari时，它似乎很有用。下面是使用的CSS类。 porto-item是图库项目

.porto .porto-item:hover img {
  -webkit-transform: scale(1.2);
      -ms-transform: scale(1.2);
          transform: scale(1.2);
  opacity: .2;
}
.porto .porto-item:hover .porto-info {
  opacity: 1;
  box-sizing: border-box;
  height: 100%;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
}
.porto .porto-item:hover .title {
  opacity: 1;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  text-shadow: 0 0 0 white;
}
.porto .porto-item:hover .categories {
  opacity: 1;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  text-shadow: 0 0 0 white;
}
.porto .porto-item:hover .more {
  opacity: 1;
  -webkit-transform: scale(1);
      -ms-transform: scale(1);
          transform: scale(1);
  text-shadow: 0 0 0 white;
}

Answer 1

如果你想要它，那么只要触摸项目，就会出现悬停（如果滚动），那么你可以将cursor: pointer;添加到你希望悬停显示的元素上。如果没有此iOS，则只会在链接上显示:hover个事件。

Safari问题与css转换

1 个答案: