小编Jos*_*a R的帖子

使用perspective,rotateX,rotateY和scale时,CSS转换Webkit中的悬停错误

我有以下小提琴:http: //jsfiddle.net/cYwkz/

我正在使用以下CSS:

article {
  border: 2px solid #cccccc;
  background-color: #e5e5e5;
  border-radius: 5px;
  display: inline-block;
  height: 150px;
  margin: 0 2% 32px;
  position: relative;
  vertical-align: top;
  width: 160px;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -webkit-transition: all .2s ease;
  -moz-transition: all .2s ease;
  transition: all .2s ease;
  -webkit-transform-style: preserve-3d; 
  -moz-transform-style: preserve-3d; 
  -o-transform-style: preserve-3d; 
  transform-style: preserve-3d; 
  -webkit-transform-origin: center;
  -moz-transform-origin: center;
  -o-transform-origin: center;
  transform-origin: center;
}
article:hover {
  -webkit-transform: perspective(400px) rotateX(5deg) rotateY(5deg) scale(1.025);
  -moz-transform: perspective(400px) rotateX(5deg) rotateY(5deg) scale(1.025);
  -ms-transform: perspective(400px) rotateX(5deg) rotateY(5deg) scale(1.025);
  -o-transform: …
Run Code Online (Sandbox Code Playgroud)

css transition webkit transform css3

7
推荐指数
1
解决办法
5906
查看次数

标签 统计

css ×1

css3 ×1

transform ×1

transition ×1

webkit ×1