jQuery: Anything Slider - Multiple Sliders - Reset other sliders to first slide?

Question

I'm using Anythingslider to show 3 x sliders on one page.

Each slider is within a tab...e.g. click "Tab 1" - Slider 1 will show, click "Tab 2" Slider 2 will show etc etc...

Trouble is, slides are not reset on each tab..e.g. if i'm on "Tab 1" and viewing slide 3, then I click on "Tab 2" and then back to "Tab 1" - it's still on slide 3 - not reset to slide 1....

So my question is how can I reset the slides back to one, when click viewing other tabs?

It's almost like you need a jquery version of the following:

IF you click an <li class="tab"> then reset all sliders to slide 1..

Anyhoo, someone may have a better idea? Hope someone can assist?

Answer 1

Try this:

$(document).ready(function(){

    $('.tab').click(function(){
        $('.anythingSlider').anythingSlider(0);
    });

});

You can also use set your other click actions for '.tab' by binding them to the click event:

$(document).ready(function(){

    $('.tab').bind("click", function(){
        $('.anythingSlider').anythingSlider(0);
        // other .tab click actions
    });

});

Answer 2

Check this

this example handles manual navigation of slides in AnythingSlider, you can navigate to the first slide if you want to reset the sliders when click the li element