Question

我在尝试为IE，Edge和移动版Safari中的转换添加转换时遇到了问题。有一个元素会被另一个用jQuery添加的类转换。全高元素的css如下：

.post-hero {
   height: calc(100% - 178px);
   width: 100%;
   position: fixed;
   left: 0;
   padding: 0 25px;
   margin-top: 128px;
   transition: (1.2s, all, cubic-bezier(0.22, 0.44, 0, 1));
}

此类会在点击事件中添加

.up {
   transform: translateY(-100%) translateY(88px);
}

.down {
  transform: translateY(+100%) translateY(88px);
}

转换在Firefox和Chrome中运行良好。但是其他浏览器也应该支持它（http://caniuse.com/#search=transition）

修改

关于语法的全部内容。 transition: (1.2s, all, cubic-bezier(0.22, 0.44, 0, 1));不是有效的CSS。应为transition: 1.2s all cubic-bezier(0.22, 0.44, 0, 1);

Answer 1

如上所述，它是缺少元标记的组合：<meta http-equiv="X-UA-Compatible" content="IE=edge" />和过渡transition: (1.2s, all, cubic-bezier(0.22, 0.44, 0, 1));的错误CSS语法，应以这种方式声明：transition: 1.2s all cubic-bezier(0.22, 0.44, 0, 1); < / p>

转换不适用于IE和Edge以及Safari

1 个答案: