How to scroll to an accordion *inside* an opened accordion?

Question

I have the following structure (might have gotten the copy/paste wrong after the content reduction). It's basically a collapse element inside a collapse element.

I also have the following code, used to scroll to the opened accordion element once clicked:

$(".accordion").on("shown.bs.collapse", function() {
    var myEl = $(this).find('.collapse.in').prev('.panel-heading');
    $('html, body').animate({
        scrollTop: $(myEl).offset().top - 6
    }, 500);
});

This snippet works - as long as the accordion element does not have a child accordion. With the child accordion, what happens is that once opening the parent accordion and then the child accordion, it scrolls to the child element but then scrolls to the parent element.

What do I need to modify in the JavaScript snippet to get this working?
I'm pretty sure the current issue happens due to the use of .prev.

Gleb Kemarsky · Accepted Answer

Unfortunately, the shown.bs.collapse event is fired for both accordions when you open the child accordion.

UPD. You can avoid the second event by event.stopPropagation()

https://jsfiddle.net/glebkema/t1wqbxwh/

$(".accordion").on("shown.bs.collapse", function(e) {
    var myEl = $(this).find('.collapse.in').prev('.panel-heading');
    $('html, body').animate({
        scrollTop: $(myEl).offset().top - 6
    }, 500);
    e.stopPropagation();
});

You can try to use `a[aria-expanded="false"]' ).click`

https://jsfiddle.net/glebkema/soc0rp3w/

$( 'a[aria-expanded="false"]' ).click(function() {
    $('html, body').animate({
        scrollTop: $(this).offset().top - 6
    }, 500);
});

How to scroll to an accordion inside an opened accordion?

Answers (1)

UPD. You can avoid the second event by event.stopPropagation()

You can try to use `a[aria-expanded="false"]' ).click`

Related Questions

How to scroll to an accordion *inside* an opened accordion?

Answers (1)

UPD. You can avoid the second event by event.stopPropagation()

You can try to use a[aria-expanded="false"]' ).click

Related Questions

How to scroll to an accordion inside an opened accordion?

You can try to use `a[aria-expanded="false"]' ).click`