It would be nice if the WebFlow slider could trigger some DOM Events such INITIALIZING, BEFORE_SLIDE, SLIDING_LEFT, SLIDING_RIGHT, AFTER_SLIDE. Actually, It’s really easy to implement this code and brings a new world of opportunities to developers to improve their website using the WebFlow API.
Btw, we are using a custom slider controller to “improve” the slider events interactions. It could be useful for someone else, here is the link so you can take a look to the code: https://gist.github.com/uiman/7e28a4ed424bda6592eb
I’m not sure if this is still compatible, but it should work or at least you could replicate the idea. Btw the code is commented with a basic example of how to use it.
That is awesome. I will check it. Can you also share how to add event listener to target specific slides in the same page. Like jumping/sliding to a specific slide on the same page and slides in other page with your approach.
Just create a new W_SLIDER_CONTROLLER instance for each slider ID you want to control and save a reference to each one. Then you will be able to call specific methods like next() or goto(i) for each slider.
var sliderA = new W_SLIDER_CONTROLLER("#main-slider"),
sliderB = new W_SLIDER_CONTROLLER("#inner-slider");
sliderA.next();
sliderB.goto(2);