Animação CSS

16/07/2013

0

estou com um exemplo de animação com CSS, mas não ta funcionando.

html


<html>
	<head>
		<title>Título da página</title>
		<link href="estilo_01.css" rel="stylesheet" type="text/css" />	
	</head>
	<body class="aula26">
		<div>
			qualquer texto	
		</div>
	</body>
</html>



css


@Keyframes animacaoAula26 {
	0% {
		background: black;
		width: 100px;
		position: absolute;
		top: 5px;
		left: 5px;
	}
	
	25% {
		background: blue;
		width: 150px;
		position: absolute;		
		left: 400px;
	}
	
	50% {
		background: red;
	}
	
	75% {
		background: yellow;
		top:200px;
	}
	
	100% {
		background: green;
	}
}

Roniere Almeida

Roniere Almeida

Responder

Posts

17/07/2013

Marcelo Pastore

Roniere, eu testei seu codigo e descobri o problema, mas me diga qual seu navegador.
Responder

17/07/2013

Roniere Almeida

google chrome.
Responder

17/07/2013

Marcelo Pastore

notei que nele não funciona, testa no firefox.
Responder

17/07/2013

Roniere Almeida

infelizmente é isso mesmo, tenho que aprender a testar com os principais browsers.

vlw!!!
Responder

17/07/2013

Roniere Almeida

infelizmente é isso mesmo, tenho que aprender a testar com os principais browsers.

vlw!!!
Responder

17/07/2013

Marcelo Pastore

de nada Roniere!!! boa sorte!!!
Responder

17/07/2013

Joel Rodrigues

E qual era o problema?
Responder

18/07/2013

Roniere Almeida

essa animação não funciona do google chrome, só isso.
Responder

18/07/2013

Joel Rodrigues

Você tem que usar o prefixo -webkit para funcionar no Chrome e Opera.
Responder

19/07/2013

Joel Rodrigues

Opera não, Safari.
Responder

22/07/2013

Marcelo Pastore

Você tem que usar o prefixo -webkit para funcionar no Chrome e Opera.


me lembrei disso tarde, hahahaha
Responder

22/07/2013

Roniere Almeida

Você tem que usar o prefixo -webkit para funcionar no Chrome e Opera.


pq o opera fica de fora?
Responder

22/07/2013

Joel Rodrigues

Algumas propriedades não foram implementadas como padrão em todos os browsers. Uns fizeram primeiro, outros depois, cada um fez do seu jeito, e por aí vai.
Por isso surgiram os prefixos criados pelos fabricantes para permitir o uso de algumas coisas em seus browsers.
Responder

Assista grátis a nossa aula inaugural

Assitir aula

Saiba por que programar é uma questão de
sobrevivência e como aprender sem riscos

Assistir agora

Utilizamos cookies para fornecer uma melhor experiência para nossos usuários, consulte nossa política de privacidade.

Aceitar