Cada vez mais o CSS3 é compatível com os navegadores atuais. A cada nova versão do Chrome, FireFox e Internet Explorer (hein!?) podemos utilizar mais recursos deste novo padrão para folhas de estilo. E com certeza o recurso de animação é um dos mais utilizados, ainda mais para quem pretende migrar doFlash para a dobradinha HTML5/CSS3.
Para ajudar quem pretende criar suas primeiras páginas animadas vamos apresentar agora uma ferramenta muito útil, quase um framework, que irá ajuda-lo a criar praticamente qualquer tipo de animação e o melhor, totalmente compatível com navegadores desktop e mobile, claro, IE 8 e 9 não rodam tudo, mas a versão 10 já esta bem melhor e compatível.
CSS3 Animation Cheat Sheet
Crie Animações CSS3
CSS3 Animation Cheat Sheet é uma biblioteca CSS para criação de animações variadas em qualquer projeto web, inclusive os mobile. Utilizando este conjunto de códigos você será capaz de criar elementos animados e até interações avançadas com seus usuários e visitantes.
Basicamente é só escolher o tipo de animação que deseja e colocar a “classe” correspondente nos elementos corretos na estrutura do seu HTML. Simples assim. Você utilizará o CSS3 @keyframes e não precisará se preocupar com o posicionamento do elemento que será animado, ele vai permanecer no mesmo lugar. Caso o seu usuário utilize um navegador antigo não precisa se preocupar, ele só não verá a animação, mas nenhum conteúdo será escondido.
Fala sério! Não é demais poder utilizar uma ferramenta como o CSS3 Animation Cheat Sheet?
Download e Informações
CSS3 Animation
O CSS3 Animation Cheat Sheet pode ser baixado e utilizado livremente em qualquer tipo de projeto web para desktop ou mobile. Para utiliza-lo corretamente basta seguir a documentação no site oficial. Tudo muito simples e fácil. Não esqueça de chamar o jQuery (Não o Jim Carrey!) no seu código.
Teste bastante e crie sites mais dinâmicos e muito mais interessantes. Com certeza sabendo como usar o recurso de Animação do CSS3 você terá um projeto de sucesso.
fonte : http://www.tekzoom.com.br/css3-animation-crie-animacoes-utilizando-css3-facilmente/
Nenhum comentário:
Postar um comentário