Transiciones en CSS

jagp1119 · #1 (**permalink**) 08/12/2013, 13:48

Hola estoy realizando unas transiciones en un página, pero quisiera saber como ejecutar las transiciones cuando de clic en un boton determinado, sin necesidad de dar clici directamente en el objeto donde se ejecutara la transición.
Gracias.

PHPeros · #2 (**permalink**) 08/12/2013, 14:01

Definitivamente, con JavaScript.

pzin · #3 (**permalink**) 08/12/2013, 15:10

Se podría hacer con CSS, aunque sería algo sucio y te rompería la semántica HTML, por lo que lo más correcto es, al menos con JavaScript, añadir una clase al elemento cuando se haga click sobre el que inicie la acción.

Código CSS:

Ver originaldiv#a_animar {
  background-color: #ff000;
}
 
div#a_animar.animando {
  background-color: #f0f0f0;
  transition: all 200ms;
}

Entonces al añadir la clase animado —que harías con JavaScript— empezaría la transición.

jagp1119 · #4 (**permalink**) 08/12/2013, 18:15

Gracias por las respuestas, hay algun sitio donde pueda mirar esto?, es que estoy apenas comenzando con javascript.

pzin · #5 (**permalink**) 08/12/2013, 18:20

Podemos mover el tema a ese foro, seguro que alguien te ayuda o te da alguna referencia.

Pantaláimon · #6 (**permalink**) 09/12/2013, 06:44

Dejo este link del foro bastante reciente. Quizá te pueda interesar.

jagp1119 · #7 (**permalink**) 09/12/2013, 12:45

Una pregunta, jquery me puede servir para esto, que tan recomendable es usarlo?, o seria lo mismo que trabajarlo con Javascript?. Gracias.

PHPeros · #8 (**permalink**) 10/12/2013, 08:16

No hay necesidad de cargar librerías... Pero si no te manejas bien, el animate() de jQuery te lo pone muy fácil.

jagp1119 · #9 (**permalink**) 10/12/2013, 08:28

Pero entonces solo con javascript y css se pueden hacer las animaciones que uno quiera, o algunas librerias tienen opciones diferentes?

PHPeros · #10 (**permalink**) 10/12/2013, 08:32

Cita:

Iniciado por jagp1119

Pero entonces solo con javascript y css se pueden hacer las animaciones que uno quiera, o algunas librerias tienen opciones diferentes?

Todo lo que se puede hacer en jQuery o cualquier framework se puede hacer con puro JavaScript, sólo hay una diferencia; escribes menos y consigues buenos efectos sin saber mucho.