使用vw进行CSS翻译不适用于iOS< 8,解决方法?

时间:2014-12-22 17:37:39

标签: ios css css3 mobile

显然使用transform: translate个单位vw进行操作并不适用于iOS< 1> 8。

这是一个演示,比较translate%,适用于移动和非移动,以及vw仅适用于iOS 8+和非移动设备:

http://codepen.io/rachel-carvalho/pen/azmoPJ?editors=110

#p {
  -webkit-transform: translate(10%, 0);
  transform: translate(10%, 0);
}

#vw {
  -webkit-transform: translate(10vw, 0);
  transform: translate(10vw, 0);
}

我不知道其他移动设备是否存在翻译vw的问题,但我无法在网上找到有关此问题的任何内容。

我想知道是否有其他人遇到此问题以及是否有可靠的方法来检测此行为,因此我可以使用javascript进行解决。

1 个答案:

答案 0 :(得分:0)

对于某些浏览器(特别是IE),我在过去使用vmax, vw 时遇到了同样的问题 并且知道它确实支持但是它们是部分支持,有时它可能会工作有时可能不会, Check here

为此您可以使用jquery库动态地将vw转换为px buggyfill .js

希望它对你有用!