Это происходит в Safari 6 на Mountain Lion и в последнем хроме. (подтверждено в OSX, может не произойти в Windows)
См. эту страницу для примера:
http://users.telenet.be/prullen/flicker2.html
Быстро передвиньте мышь и снимите изображение и посмотрите на текст ниже. Вы увидите, что он мерцает/пульсирует.
Соответствующий CSS ниже. Я не могу внести никаких изменений в классы .out
и .in
. Только для класса элемента.
Я попытался добавить -webkit-backface-visibility:hidden;
, как я где-то читал, что это должно исправить, но это не имеет никакого значения.
Кто-нибудь знает?
Спасибо, Wesley
.out {
position: relative;
display: block;
margin: 0;
border: 0;
padding: 0;
margin-left: auto;
margin-right: auto;
overflow: hidden;
}
.in {
position: relative;
display: block;
margin: 0;
padding: 0;
border: 0;
overflow: hidden;
}
.item {
margin: 60px;
-webkit-transition: -webkit-transform .15s linear;
-moz-transition: -moz-transform .15s linear;
-o-transition: -o-transform .15s linear;
transition: transform .15s linear;
-webkit-transform-style: preserve-3d;
-moz-transform-style: preserve-3d;
-o-transform-style : preserve-3d;
-ms-transform-style : preserve-3d;
}
.item:hover {
-webkit-transform: scale(1.3) !important;
-moz-transform: scale(1.3) !important;
-o-transform: scale(1.3) !important;
-ms-transform: scale(1.3) !important;
transform: scale(1.3) !important;
}