Как масштабировать и Translate3D одновременно?
Вопрос
Возьми этот пример:
@-webkit-keyframes slideInViewport {
from{
-webkit-transform: scale(1);
-webkit-transform: translate3d(0, 0, 0);
}
to{
-webkit-transform: scale(0.8);
-webkit-transform: translate3d(250px, 0, 0)
}
}
.
Это приводит к первой переводю 250 пикселей влево, а затем масштабируется.Как я могу сделать это Translate3D одновременно оно масштабируется?
Я достиг этого анимации на свойство left
, но это приводит к очень плохой производительности.
Решение
Решение: поставить их все в одну строку.
@-webkit-keyframes slideInViewport {
from{
-webkit-transform: scale(1) translate3d(0, 0, 0);
}
to{
-webkit-transform: scale(0.8) translate3d(250px, 0, 0);
}
}
. Не связан с StackOverflow