Biotoxsin 4 Posted January 31, 2020 Report Share Posted January 31, 2020 Здравствуйте!Наверное все знают о артефактах вроде размытия или дёргающегося текста при анимации c помощью transform.Я сегодня столкнулся с артефактом который проявляется при масштабировании блока в котором находится картинка. Появляется чтото вроде тонкого border'а, снизу и справа картинки примерно в 1px не больше, чёрного цвета.Ещё никто с таким не сталкивался? Может кто знает как решить проблему, потому что стандартными методами вроде "backface-visibility: hidden" она не решается. Quote Link to post Share on other sites
Модератор files 2807 Posted January 31, 2020 Модератор Report Share Posted January 31, 2020 В песочницу закиньте https://jsfiddle.net Здесь не так много экстрасенсов Quote Link to post Share on other sites
Biotoxsin 4 Posted February 1, 2020 Author Report Share Posted February 1, 2020 13 часа назад, files сказал: В песочницу закиньте https://jsfiddle.net Здесь не так много экстрасенсов Там слишком маленькое окно для воспроизведения 1px практически не видно. Если хотите, вот обычный стандартный код для воспроизведения. <html> <body> <style> body { background:#fff; } .block { transition: all ease 1s; height:400px; width:400px; will-change: transform; -webkit-backface-visibility: hidden; } .img { height:100px; width:100px; } .block:hover{ transform:scale(1.5); } </style> <div class="block"> <div class="img"> <img width="500px" src="https://www.wallpaperup.com/uploads/wallpapers/2014/09/25/456523/8712bc3014fd5e0bd1fff922e992b966-1400.jpg"> </div> </div> </body> </html> Quote Link to post Share on other sites
Модератор files 2807 Posted February 1, 2020 Модератор Report Share Posted February 1, 2020 https://jsfiddle.net/1bphskwq (используйте ползунки для увеличения окна) В браузерах на движке Хром нет бордера. Quote Link to post Share on other sites
Biotoxsin 4 Posted February 1, 2020 Author Report Share Posted February 1, 2020 6 минут назад, files сказал: https://jsfiddle.net/1bphskwq (используйте ползунки для увеличения окна) В браузерах на движке Хром нет бордера. В том то и дело что это НЕ бордер, это скорее похоже на box-shadow, который появляется случайным образом, снизу и справа по краям (Тоже случайно либо снизу либо справа при анимации). На фулскрин там не растянуть, спасибо я работал на этих ресурсах знаю как ими пользоваться. Quote Link to post Share on other sites
Модератор files 2807 Posted February 1, 2020 Модератор Report Share Posted February 1, 2020 Вы пробовали демонстрацию на других компьютерах? Возможно все дело в вашей видеокарте, которая не справляется с отрисовкой объекта? Quote Link to post Share on other sites
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.