Подготовка к изменениям
will-change
В SIMAI Framework с помощью модифкаторов можно оптимизировать предстоящую анимацию элементов, которые должны измениться.
Классы
| Класс | Значение |
|---|---|
will-change-auto |
will-change: auto; |
will-change-scroll-position |
will-change: scroll-position; |
will-change-contents |
will-change: contents; |
will-change-transform |
will-change: transform; |
Описание
Адаптивный модификатор. Задает метод оптимизации предстоящей анимации элемента.
Использование модификатора: {контрольная точка}:{модификатор}
- Контрольная точка. Необязательный параметр. Применяет модификатор начиная с определенного размера области просмотра, согласно контрольным точкам (
sm,md,lg,xl). Если контрольная точка не задана, то действует для любого размера области просмотра. - Модификатор. Обязательный параметр.
Пример
С помощью модификатора will-change-scroll, will-change-contents, will-change-transform, можно оптимизировать элемент, который измениться, указав браузеру подготовить необходимую анимацию до того, как она действительно начнется.
<div class="will-change-scroll ..."><!-- ... --></div>