Почему при наведении в процессе трансформации ухудшается качество?
Почему когда идет масштабирование (transform: scale(n); transition: transform ns) снижается качество и фокусируется на последнем этапе?)
Код: https://codepen.io/ErmaKing/pen/VrZLaW
Кстати, как вам, что посоветуете?))
Не могу к сожалению Вам точно ответить, но кажется, это связано с тем, что браузер (по какой-то причине) просчитывает промежуточные значения по упрощенному алгоритму, что бы "не тормозило", аналогичный эффект иногда можно наблюдать при первичном анализе (открытии) JPEG-файлов (т.е. на "начальном этапе загрузки").
Сергей, не могу с этим поспорить, как устроен формат JPEG я знаю... в отличии от принципов работы браузера, но мне кажется некоторые логические сходства в этих процессах - вполне могут быть...
Ермахан Сабыржанов, это нормально. Ненормально - бесконечное использование дробных значений в пикселях (округлите до целых). Еще, можете слегка замаскировать эффект, добавив легкую тень от текста. Но совсем он не пропадет.
Moskus, ну... на данный момент, ложность моего вывода пока ещё ни кем (и ни чем) объективным не доказана, иначе говоря - типичный ложный вывод о другом выводе :)))
Евгений Вольф, это уже просто смешно.
Ситуация с декодированием JPEG связана с прогрессивным декодированием, когда сначала показывается изображение меньшей детализации, потом большей.
Ситуация с искаженным изображением текста при трансформации связана с использованием интерполяции nearest neighbor (целочисленным округлением).
Общего между ними - только видимая "зубчатость" изображения, имеющая совершенно разную природу.
Сказали ерунду - имейте смелость признать, а не упираться и ссылаться на "не пойман - не вор".
Если вас одолевает перфекционизм, используйте обычный image size вместо transistion, этим вы обойдёте неизбежный "некрасивый" рендеринг пикселизации браузера
