Javascript Image Slider / Posts /

Change background color for text blurb for each new slide

Great product! One issue, though, I can't work out is this: Each of my slide pictures are way different in color tone. So I'd like to adjust the text color as well as the semi-transparent background color to make each slide readable.

For the text itself I can simply adjust the text color by wrapping it in a div this way: <div style="color=red">my red text</a div>. But for the semi-transparent background color this simple work-around does not work.
Also, if I change the background color in the css directly at, I can only set the background color for all slides equally.

Is there a way to change the semi-transparent background color for each slide text?

Tanju  4 years ago   viewed: 10208    

2 Answers

I think the beforeSlideChange or afterSlideChange event handler can help you to implement it. The two event handlers are described in demo4

A sample implementation using the event handler might also help, though it is for a different task:
How to hide the caption when I play the video in the slider
Milo   4 years ago
Thanks, Milo, looks just like what I was looking for! 

I'll probably use that function to simply run querySelectorAll('.mc-caption-bg') to update the style accordingly.
  4 years ago


Your name*
(Optional. Used to modify this post afterwords)
+ =  

Ask your Own Question

  • If your question is related to the topic of this post, you can post your question to this page by clicking the "Post a reply" button at left;

  • When you want to start a new page for your question: