悬停转换过渡不起作用

Question

所以我有这个图像，我希望在胡扯时增加它的饱和度。

这是图像的类：

.trans {
    -webkit-filter: saturate(70%);
  -webkit-transition: saturate 2s ease;
     -moz-transition: saturate 2s ease;
       -o-transition: saturate 2s ease;
      -ms-transition: saturate 2s ease;
          transition: saturate 2s ease;
}

.trans:hover {
  -webkit-filter: saturate(190%);

}

胡佛正在工作并且饱和度增加，但过渡是即时的，并且不需要2秒（或我放的其他值）。我注意到在这个网站上我尝试了另一种悬停效果（模糊图像），我遇到了同样的问题。

我该怎么办？

Answer 1

我相信你需要使用＆＃34; filter＆＃34;或＆＃34; -webkit-filter＆＃34;作为过渡的目标，例如

.trans {
    -webkit-transition: -webkit-filter 2s ease;
    transition: -webkit-filter 2s ease;
}