I'm using jQuery Cycle on a project. You can see my script at pastebin.
Basically, there are three different sliders tied to the same directional controls. I'd like their transitions to be synchronized.
As it stands, since there are three separate slider instances here, they start out synchronized, but eventually fall out of sync — sometimes immediately, if you leave the browser window or something. This causes the sequences to go out of order and generally looks off. I'd like for all the sliders to fire at the exact same time, preferably linked to the .sliderImages slides.
I've tried creating a function that contains the other two sliders and putting that in the before option on the .sliderImages slider, but that makes it go all wonky and I don't know enough JS to be able to troubleshoot.
As usual, any help is appreciated.
Thanks!
So after banging my head against a wall for awhile, I stumbled upon Ryan Florence's jQuery Slideshow. It's much (much, much) lighter than Cycle or pretty much any other slideshow plugin I've tried (even though it requires jQuery UI), it's well-documented, and relatively easy to drop in and get working how you wish.
There's a thread on his slideshow Github page where he helped me get the code working properly, along with a link to the final code.
Of course, if anybody has suggestions to improve my code, I'm open to them. But this plugin's about as dead simple and versatile as they come.
Perhaps a more talented programmer than I could make it mobile-friendly, like Flexslider...