Руст Кулматов
|
С помощью инспектора анимаций в Хроме можно прямо на странице подкрутить анимации без знания ЦСС и функций сглаживания. Инспектор анимаций находится в отдельной вкладке в выдвигающейся панели (Console Drawer), которую можно открыть с помощью клавиши Esc или через меню. Если вкладку не видно, то её можно включить в выпадающем списке: Открытый инспектор анимаций записывает все анимации, происходящие на странице, и отображает их в виде схем. Линейки в схеме соответсвуют движениям в анимации, поэтому, чем сложнее анимация, тем насыщеннее будет схема: ![]() При наведении на схему, появится превью анимации. При клике, анимация проиграется заново, а схема раскроется в более подробную, на которой видно как свойства изменялись на определённых отрезках времени и с какими функциями сглаживания: Инспектор позволяет перезапустить анимацию, проиграть её на замедленной скорости или перемотать её на нужный отрезок: Схема анимаций интерактивная, поэтому можно на месте подвигать анимации и поиграть с их длиной: Наконец, если кликнуть на отрезок с анимацией, то во вкладке стилей отобразятся ЦСС свойства, применённые к элементу. Среди этих свойств будет Вот и всё. С помощью инспектора можно рассмотреть анимацию повнимательнее, немного её подкрутить и передать результат технологу в понятном для него виде. |
Первая часть |
P. S. Это был совет о
|