При масштабировании элемента с масштабом css3 он становится пиксельным до тех пор, пока анимация не будет завершена. Я анимирую элемент с рамкой

Question

http://jsfiddle.net/nicktheandroid/5Ytnj/

Когда я добавлю -webkit-backface-visibility: hidden; к .circ элемент, он заставляет его оставаться пиксельным даже после завершения анимации.

Мне интересно, есть ли способ заставить его не пикселизировать при анимации. Я просматривал его в версии Google Chrome.

Answer 1

Итак, я думаю, что я придумал работу вокруг;

по существу; не используйте "масштаб". используйте "scale3d" и настройте его так, чтобы изображение было максимально большим scale3d(1,1,1),

Вот пример с тем кругом, который у вас был там. Я изменил масштаб на 5, потому что я не хотел помещать 0.222222222222222222222222222222222 в функцию scale3d...

[править] Итак, я снова попробовал демо-версию jsfiddle на компьютере без аппаратного ускорения, и эффект пикселизации пропал. Таким образом, кажется, что это та же проблема, что и с scale3d, где он преобразует ее в текстуру, а затем масштабирует ее. вы можете сделать как в circ3 здесь