Fóruns sobre PHP, JavaScript, HTML, MySQLi, jQuery, Banco de Dados, CSS

Moderador: web

 
Avatar do usuário
ADMIN
ADMIN
Tópico Autor
Mensagens: 17246
Nome: Kleber
Descrição do site: Onde você encontra scripts grátis para o seu site
Sexo: Masculino
Localização: RJ / RJ / Brasil
Contato:

Como fazer transição de cores em links, divs tudo com CSS

03-05-2015 07:57

Esse é um modo bem fácil de fazer transição em links usando somente CSS, sem o uso de jQuery.

Esse efeito de transição funciona nos navegadores Opera, Chrome, Internet Explorer e Firefox.
1.5 equivale ao tempo de duração do efeito. Quanto maior o tempo, mais demorado.

Segue um exemplo para criar transições de cores em links

<style> .link { transition: all 1.5s ease; color: black; font-size:20px; font-family:verdana; } .link:hover { color:orange; } </style> <a href="http://www.codigosnaweb.com" class="link">link</a>

Para fazer a transição da cor em divs, pode usar esse exemplo

<style> .div { transition: all 1.5s ease; background-color:white; } .div:hover { background-color:green; } </style> <div class="div">DIV</div>

Para ver a documentação sobre o efeito transitions do CSS, onde tem todos os valores possíveis para usar, acesse esse link http://www.w3.org/TR/css3-transitions/
2
Criar site grátis Wix
Hospedagem de sites Hostgator
Tem um script legal em HTML, CSS, PHP, HTML, JavaScript, jQuery? Poste e compartilhe com os usuários do fórum
:rock:

Quem está online

Usuários navegando neste fórum: Nenhum usuário registrado