Plugin Slider Revolution: How to influence an element color by slide?

In some cases it can be quite useful that an element outside the slider behaves differently depending on the slide displayed. In the following case it is about adjusting the color of the element.

In the desired slide, under Link & SEO, in the Custom Fields field, insert the following value (in the newer version, under Tags & Link, in the HTML Data field):

data-color="light"

This is followed by a short CSS code with sr- prepended to the whole.

body.sr-light {background-color: #fff;}

Last but not least, the following JavaScript code must be added:

var api = revapi1.on('revolution.slide.onchange', function(e, data) {
 
  jQuery('body').removeClass('sr-light').addClass(
    'sr-' + api.find('rs-slide').eq(data.slideIndex - 1).attr('data-color')
  );
});

revapi1 must be replaced by the API name of the used slider.

Through these adjustments, a class with the name sr-light will be visible in the body when the slide is displayed.

Finally, the desired element must be adapted, which is possible with the following code:

body.sr-light .entry-content {color: #fff;}