Exemplo
Passe o mouse sobre um elemento div para alterar gradualmente a largura da tabela:
div
{ propriedade de transição: largura; -moz-transition-property: largura; /* Firefox 4 */ -webkit-transition-property:largura; /* Safari e Chrome */ -o-transition-property:width; /* Ópera */ } div:hover {largura:300px;}
Experimente »
Existem mais exemplos no final desta página.
Suporte ao navegador
Os números na tabela representam a primeira versão do navegador que suporta este atributo.
O número imediatamente antes de -webkit-, -ms- ou -moz- é o primeiro número de versão do navegador que suporta este atributo de prefixo.
| Atributos | |||||
|---|---|---|---|---|---|
| propriedade de transição | 26.0 4.0 -webkit- |
10,0 | 16,0 4,0 -moz- |
6.1 3.1 -webkit- |
12,1 10,5 -o- |
Definições de propriedade e instruções de uso
O atributo transaction-property especifica o efeito nametransition da propriedade CSS (o efeito de transição iniciará alterações na propriedade CSS especificada).