# 037 - Manipulación del color - Trucos CSS

Anonim

Cuando estábamos jugando con brindar capacidades de CMS al control deslizante de la página de inicio, le dimos un campo personalizado a cada diapositiva de la página de inicio con un selector de color. Eso nos da acceso a ese color donde lo necesitemos. En la plantilla, envolveremos cada diapositiva con un data-*atributo en el que colocamos ese valor de color por cortesía de la API de Advanced Custom Field.

 

Royal Slider también nos brinda un evento que se activa cuando cambia la diapositiva. Entonces, ahora podemos tomar el color "actualmente activo" para esa diapositiva cuando lo necesitemos:

slider.ev.on('rsAfterSlideChange', function(event) ( var mainColor = $(".rsActiveSlide") .find(".rsContent") .data("main-color"); // Do stuff with the color! ));

Podríamos tomar ese color y aplicarlo a los elementos de la forma que queramos con jQuery. Damos un paso más allá y aclaramos / oscurecemos el color y luego lo aplicamos.