CSS3 Свойство transition-property
Полный CSS Справочник
Пример
Переместите указатель мыши над элементом div и измените его ширину с плавным эффектом перехода:
div
{
transition-property:width;
-moz-transition-property: width; /* Firefox 4 */
-webkit-transition-property:width; /* Safari и Chrome */
-o-transition-property:width; /* Opera */
}
div:hover {width:300px;} |
Попробуйте сами » Еще примеры внизу этой страницы.
|
Поддержка Браузерами
Свойство transition-property не поддерживается ни одним браузером.
Firefox 4 поддерживает альтернативное свойство -moz-transition-property.
Safari и Chrome поддерживают альтернативное свойство -webkit-transition-property.
Opera поддерживают альтернативное свойство -o-transition-property.
Определение и ИспользованиеСвойство transition-property указывает название свойства CSS, на которое воздействует переход
(эффект перехода начинается, когда указанное CSS свойство
изменяется).
Совет: Эффект перехода обычно привязывают к перемещению указателя мыши
над элементом.
Замечание: Всегда указывайте свойство transition-duration, иначе
продолжительность равна 0 и эффекта перехода не будет.
Значение по умолчанию: |
all |
Наследуется: |
нет |
Версия: |
CSS3 |
JavaScript синтаксис: |
объект.style.transitionProperty="width,height" |
Синтаксис
transition-property: none|all|свойство; |
Значение |
Описание |
none |
Никакое свойство не подвергается эффекту перехода |
all |
Все свойства подвержены воздействию перехода |
свойство |
Определяет список названий CSS свойств через запятую, на которые будет воздействовать эффект перехода
|
|
Попробуйте сами - Примеры |
Эффект перехода - изменение двух свойств
Переместите указатель мыши над элементом div и измените его ширину и высоту с плавным эффектом перехода.
Полный CSS Справочник
|