Question

好的，我看过类似的问题，但在我的情况下没有任何工作 - 我有一个转换比例/过渡，只在Safari中不起作用。规模发生但它快照 - 没有过渡。代码：

.site-title a {
  img {
    -webkit-transition-timing-function: cubic-bezier(0, 1.4, 1, 1) 0s;
    -o-transition-timing-function: cubic-bezier(0, 1.4, 1, 1) 0s;
    -moz-transition-timing-function: cubic-bezier(0, 1.4, 1, 1) 0s;
    transition-timing-function: cubic-bezier(0, 1.4, 1, 1) 0s;
  transition-duration: 300ms;
  }
}
 .site-title a:hover {
 img {
   transform: scale(1.03);
   content: url("https://firebasestorage.googleapis.com/v0/b/file-hosting-723cd.appspot.com/o/Asset%201.png?alt=media&token=07551984-08b6-4c8e-99b4-69280e148aa2")
}
 }
 .site-title a:selected {

 img {
   transform: scale(1.03);
   content: url("https://firebasestorage.googleapis.com/v0/b/file-hosting-723cd.appspot.com/o/Asset%201.png?alt=media&token=07551984-08b6-4c8e-99b4-69280e148aa2")
}
 }

我添加了各种过渡，但Safari跨越了一些。这里有什么不对？

Answer 1

您可以使用此代码。

img {
    -webkit-transform: translateZ(0);
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}
img:hover {
    -webkit-transform: scale(1.2);
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -ms-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
}

转换规模转换仅在Safari中不起作用？

1 个答案: