歌剧中的模拟webkit变换

时间:2013-05-29 17:18:03

标签: css3 transform opera

我的代码中有这个属性。

-webkit-transform: rotateY(65deg);
//or
transform: rotateY(65deg);

这适用于IE和FireFox。我需要,它也适用于Opera。我找不到歌剧的财产。歌剧中有这种属性的类似物吗?

这是我的全部代码:

    body {
  -webkit-perspective: 300px;
  perspective: 300px;
}

#trapezoid {
  background-image: url("http://3.bp.blogspot.com/-D9i-wqTIjFw/T5x_51p2rJI/AAAAAAAABLs/VytuZcJGNuY/s400/indahnya.jpg") ;
  background-repeat: no-repeat;

  background-size: 100%;
  border: 1px solid gray;
  height: 60px;
  margin-left: 25%;
  -webkit-transform: rotateY(65deg);
  transform: rotateY(65deg);
  width: 5em;
}

2 个答案:

答案 0 :(得分:1)

我认为您要使用的属性是CSS3 3D transform属性。

请注意,W3C将其放在 15.2中。 3D变换功能部分

  

<强>旋转Y()
      与rotate3d(0,1,0,)相同。

正如CanIuseMozilla Network Developer告诉我们的那样,Opera现在不支持这一点,(但未来可能会这样做)。

编辑:如果你不介意使用jQuery,我发现这个插件Transit声称它可以进行CSS3转换!

答案 1 :(得分:0)

编辑我的回答......

-o是Opera的供应商前缀,但似乎-o-transform: rotateY(65deg)不起作用,因为较旧的Opera不支持3d转换。

然而最新版本,Opera Next,使用Blink可能支持-webkit-transform: rotateY(65deg