пример
Изменение кривой скорости переходного эффекта:
document.getElementById("myDIV").style.transitionTimingFunction = "linear";
Попробуй сам " Определение и использование
Свойство transitionTimingFunction определяет кривую скорости эффекта перехода.
Это свойство позволяет эффект перехода для изменения скорости по его продолжительности.
Поддержка браузеров
Свойство transitionTimingFunction поддерживается в Internet Explorer 10, Firefox, Opera и Chrome.
Safari поддерживает альтернативный, свойство WebkitTransitionTimingFunction.
Примечание: Свойство transitionTimingFunction не поддерживается в Internet Explorer 9 и более ранних версий.
Синтаксис
Возвращает свойство transitionTimingFunction:
object .style.transitionTimingFunction Установите свойство transitionTimingFunction:
object .style.transitionTimingFunction ="ease|linear|ease-in|ease-out|ease-in-out|cubic-bezier()|
initial|inherit"
Значения свойств
| Стоимость | Описание |
|---|---|
| ease | Значение по умолчанию. Задает эффект перехода с медленным стартом, то быстро, то медленно конец (equivalent to cubic- bezier(0.25,0.1,0.25,1) ) |
| linear | Задает эффект перехода с той же скоростью , от начала до конца (equivalent to cubic- bezier(0,0,1,1) ) |
| ease-in | Задает эффект перехода с медленным стартом (эквивалент cubic- bezier(0.42,0,1,1) ) |
| ease-out | Задает эффект перехода с медленным концом (эквивалент cubic- bezier(0,0,0.58,1) ) |
| ease-in-out | Задает эффект перехода с медленным начальным и конечным (эквивалент cubic- bezier(0.42,0,0.58,1) ) |
| cubic- bezier( n , n , n , n ) | Определите ваши собственные значения в функции кубического Безье. Возможные значения числовые значения от 0 до 1 |
| initial | Установка этого свойства в значение по умолчанию. Читайте о первоначальном |
| inherit | Inherits это свойство от родительского элемента. Читайте о унаследовать |
Технические подробности
| Значение по умолчанию: | легкость |
|---|---|
| Возвращаемое значение: | Строка, представляющая переходное время функция-свойство элемента |
| CSS версия | CSS3 |
Похожие страницы
Ссылка УС: transition-timing-function property
<Style Object