Skip to content

1 Navigation for 2 Sliders? #428

Closed
Twansparant opened this Issue Sep 10, 2012 · 2 comments

2 participants

@Twansparant

Hi there,

First of all; big thanks for this script! I use it all the time in my wordpress themes!
I was wundering if the following situation is possible with some tweaking;

I want to split the content of each post into 2 seperate sliders on different positions in my page so one slider can have a fading transition and one can have a horizontal transition. The second slider has navigation enabled. What I want is that the navigation of this second slider also controls the slides of the first slider.

I know this is possible with a custom 'Back' & 'Forward' button, but can it also be done with the number navigation tabs? So clicking on '4' will slide both sliders to slide nr. 4.

Thanks for any help!

@Mottie
CSS-Tricks member
Mottie commented Sep 10, 2012

Hi Twansparant!

Try this - demo

$('#slider1').anythingSlider({ 
    mode: 'f',
    buildNavigation: false,
    buildStartStop: false
});

$('#slider2').anythingSlider({
    mode: 'h',
    onSlideBegin: function(e, slider){
        $('#slider1').anythingSlider( slider.targetPage );
    }
});
@Twansparant

Wow, brilliant! Thanks a lot, totally works!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Something went wrong with that request. Please try again.