Add an extra click function to tabs

  • Resolved sim89

    (@sim89)


    8 years, 6 months ago

    Hi – I’m developing a site locally and would like to add an extra function when the tabs are clicked. I would like the page to scroll to the top of the relevant tab panel. I’m happy with making the scroll animation happen but can’t figure out the correct javascript to trigger the onclick event. The usual $(‘#tab1’).on(‘click’, function(){}); is not working. Thanks in advance.

Viewing 4 replies - 1 through 4 (of 4 total)
  • Plugin Author cubecolour

    (@numeeja)

    8 years, 6 months ago

    You should be able to use something like:

    
$("body").on("click", "#tablist1-tab1, .responsive-tabs__heading:nth-of-type(1)", function() {
	alert("First Tab of First Tabgroup clicked");
});
    Thread Starter sim89

    (@sim89)

    8 years, 6 months ago

    That works perfectly – thanks!

    aliferis

    (@aliferis)

    8 years, 5 months ago

    Can you help me do this for all tabs in a group

    for example, I tried this but it does work in same method your code above worked for tab1

    ‘ jQuery(document).ready(function(){
    jQuery(“body”).on(“click”, “.responsive-tabs__list__item”, function() {
    //alert(“Tab clicked”);
    FWP.reset();
    });

    Plugin Author cubecolour

    (@numeeja)

    8 years, 5 months ago

    You should have posted this as a new topic as this is a resolved topic and your question is not the same as that which has been answered.

    Selectors for both the tab and view and accordion view are needed. Removing the specificity to target specific tabs should enable the function to fire when any tab is clicked. eg:

    
$("body").on("click", "responsive-tabs__list__item, .responsive-tabs__heading", function() {
	alert("Tab clicked");
});
Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Add an extra click function to tabs’ is closed to new replies.