Tutorial Divi: Desactiva la animación de los elementos de las diapositivas

Si alguna vez has tratado de quitar el efecto animado que hacen los textos y distintos elementos de las diapositivas de Divi ya te habrás dado cuenta de que no hay un ajuste para ello.

Me refiero a ese efecto que hace como si rebotase desde abajo, como en la siguiente captura…

Si, como a mi, ese efecto le sobra, al menos tiene solución, en 2 pasos.

Añade una clase CSS a la diapositiva

Este primer paso no tiene misterio (bueno, ninguno), solo tienes que editar el carrusel de diapositivas y añadirle una clase CSS personalizada, por ejemplo

mi_diapositiva

.

Guarda los cambios en el módulo y en la página dónde esté.

Desactiva la animación

Ahora que ya tenemos una clase CSS sobre la que actuar, para no hacerlo indiscriminadamente, vamos a aplicar la magia del CSS para desactivar ese efecto de animación.

Para ello abre el Personalizador de WordPress (

Apariencia > Personalizar

) y ve a la sección de «CSS adicional».

Ahí añade el siguiente código, cambiando el nombre de la clase CSS del ejemplo por la que tú hayas elegido.

/* Desactivar animación diapositiva Divi - Requiere la clase CSS mi_diapositiva */
.mi_diapositiva .et_pb_slide_image ,.mi_diapositiva .et_pb_slide:first-child .et_pb_slide_image img.active {
animation-name: none!important;
-webkit-animation-name: none!important;
-moz-animation-name: none!important;
-ms-animation-name: none!important;
-o-animation-name: none!important;
}
.mi_diapositiva .et_pb_slide_description {
-webkit-animation-name: fadeOut!important;
-moz-animation-name: fadeOut!important;
-ms-animation-name: fadeOut!important;
-o-animation-name: fadeOut!important;
animation-name: fadeOut!important;
}

Publica los cambios y ya lo tienes. Ahora los elementos de las diapositivas de ese carrusel ya no harán la animación.

Por supuesto, puedes aplicar la clase CSS a cualquier carrusel de diapositivas de Divi en el que quieras anular el efecto de animación.

La entrada Tutorial Divi: Desactiva la animación de los elementos de las diapositivas la publicó primero Fernando Tellado en Ayuda WordPress. No copies contenido, no dice nada bueno de ti a tus lectores.

0 comentarios

Dejar un comentario

¿Quieres unirte a la conversación?
Siéntete libre de contribuir!

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *