.example-1 { background: red;}
.example-1.my-class { background: blue;}
SiteOrigin Scrollspy Feature
The SiteOrigin Scrollspy features toggles CSS classes on widgets, rows and cells when the element enters or leaves the viewport. Additional options allow for out view hiding, setting offsets and adding delays.
Toggle classes on in widgets, rows and cells.
Viewport offsets and delays.
Hide out of view elements.
Toggle Classes on Scroll
Give a widget, row or cell as Class under it's Attribute menu that will be used to target it in the CSS. Under the Scrollspy Menu enter your Class to toggle on and off.
CHANGE BACKGROUND
Add Custom CSS
You can add your custom CSS to page anyway you like, maybe from an external file, inline or with the SiteOrigin Custom CSS plugin.
.example-1 { background: red;}
.example-1.my-class { background: blue;}