Question

I am using jQuery Tools Tabs … I am needing to open tabs from a separate link on the same page. Here is my code I am trying.

jQuery(function($){

        $('#accord1trig').click(function(){
              $(".accordion").tabs('selected', 1);
        });

        $('#accord2trig').click(function(){
              $(".accordion").tabs('selected', 2);
        });

        $('#accord3trig').click(function(){
              $(".accordion").tabs('selected', 3);
        });

        $('#accord4trig').click(function(){
              $(".accordion").tabs('selected', 4);
        });

});

and the html is as follows

<a href="#" id="accord1trig">Tab Link 1</a>
<a href="#" id="accord2trig">Tab Link 2</a>
<a href="#" id="accord3trig">Tab Link 3</a>
<a href="#" id="accord4trig">Tab Link 4</a>

Answer 1

Assuming your “separate link” is:

<a href="#" id="click-me">Click me</a>

and you want it to open “Tab Link 1”, you’d change the first jQuery .click() in your script to:

jQuery(function($){

    $('#accord1trig, #click-me').click(function(){
          $(".accordion").tabs('selected', 1);
    });

    // Remainder of your code...

});

See how I comma-separated and added #click-me to the selector there?

Update:

Based on the URL you provided, the following worked for me:

<script type='text/javascript'>
jQuery(function(){
    jQuery('h4 a[data-tab]').click(function(e){
        e.preventDefault();
        var tab = jQuery('.accordion-toggle:eq(' + (parseInt(jQuery(this).data('tab')) - 1) + ')');
        tab.triggerHandler('click').addClass('current');
    });
});
</script>