How do we make the "hover color" stay on when that slide is selected? So that if you're looking at slide 3, slide 3's trigger has the background color shown
This is possible with our Slider API (theme.co/docs/slider-api) checking the current slide on the slider and adding the class "x-active" if it is the current slide is also the goto trigger. We're considering adding this as the default behavior to our sliders as well. If you use the Element "Slider Pagination" this could possibly achieve what you are trying to do. Thanks for the feedback.
We have color controls called "Interaction" that handle the hover look and feel. We place the class x-active on any toggleable Element that is currently active. Besides that I think you can target the styling through $el:active {} in custom css. Is that what you were referring to?
wonderfully done josh! very helpful for future projects.
As always, Thanks Josh. Very much appreciated 😊
Most welcome!
Really useful! Keep 'em coming! ❤
Thank-you Michael and will do!
This is very cool. Thanks Josh!
You bet!
Thank you! Very useful!!!
Glad it was helpful!
Thank you 🎉
Our pleasure!
So useful
wow
Hey Josh, how would we keep the column one hover state constant until they hover another column?
Hey Donovan! Check out "data-x-slide-goto-keep-active" in this docs article: theme.co/docs/sliders#custom-attributes
How do we make the "hover color" stay on when that slide is selected? So that if you're looking at slide 3, slide 3's trigger has the background color shown
This is possible with our Slider API (theme.co/docs/slider-api) checking the current slide on the slider and adding the class "x-active" if it is the current slide is also the goto trigger. We're considering adding this as the default behavior to our sliders as well. If you use the Element "Slider Pagination" this could possibly achieve what you are trying to do. Thanks for the feedback.
Is there a way to change the default state of the element a user clicks on? for the sake of better accessibility.
We have color controls called "Interaction" that handle the hover look and feel. We place the class x-active on any toggleable Element that is currently active. Besides that I think you can target the styling through $el:active {} in custom css. Is that what you were referring to?
Josh, thoughts on how to make it hover on desktop and tablets, but click activated on mobile? The hover doesnt work if they scroll
Currently the trigger is setup only for one event, but we can set up a special event trigger for touch devices.