Ver Mensaje Individual
  #1 (permalink)  
Antiguo 08/01/2015, 01:03
Avatar de rodeirojg
rodeirojg
 
Fecha de Ingreso: junio-2012
Ubicación: Buenos Aires
Mensajes: 86
Antigüedad: 11 años, 11 meses
Puntos: 2
Pregunta Animación de texto en CSS

Buenas gente del foro!

Les comento que estoy animando un menú, el cual debería pasar de una instancia a otra en forma suave. Acá están las capturas de un punto y el otro (para que se den una idea).




El tema es que se me complica mucho hacer aparecer el texto por derecha, hacer que el vínculo se corra a la izquierda suavemente (y no de repente).

Estoy usando este código CSS por ahora:
Código HTML:
#button {
position: relative;
width: 675px;
margin-left: auto;
margin-right: auto;
color: #343434;
font-size: 28px;
text-align: right;
height: 52px;
background-color: #212121;
padding-top: 16px;

   -webkit-transition-property: background;
   -moz-transition-property: background;
   -o-transition-property:  background;
  	transition-property: background;
	
  -webkit-transition:all 0.5s ease-out;  /* Chrome y Safari */
  -o-transition:all 0.5s ease-out;  /* Opera */
  -moz-transition:all 0.5s ease-out;  /* Mozilla Firefox */
  -ms-transition:all 0.5s ease-out; 
 } 
 #button:hover {
background-color: #800001;
text-align: left;
text-color: #CCC;
 }
Necesito su ayuda, no es mi fuerte el css pero me pidieron esa portada.
__________________
Julian G. Rodeiro
Encargado del área de Diseño en:
www.brandestudio.com.ar