Repository navigation
Tabs JavaScript not removing 'active' class from nav-pills nav-stacked #20797
Description
Activity
Hi @P-h-i-l!
You appear to have posted a live example (http://codepen.io/anon/pen/ALRGqj.html), which is always a good first step. However, according to the HTML5 validator, your example has some validation errors, which might potentially be causing your issue:
- line 13, column 3 thru column 75: An element with
role=tabmust be contained in, or owned by, an element withrole=tablist. - line 14, column 3 thru column 65: An element with
role=tabmust be contained in, or owned by, an element withrole=tablist. - line 15, column 3 thru column 71: An element with
role=tabmust be contained in, or owned by, an element withrole=tablist.
You'll need to fix these errors and post a revised example before we can proceed further.
Thanks!(Please note that this is a fully automated comment.)
Reacted by Phil and Leon Hoffmann- line 13, column 3 thru column 75: An element with
- changed the title
[-]Tabs JavaScript not working with nav-pills nav-stacked[/-][+]Tabs JavaScript not removing 'active' class from nav-pills nav-stacked[/+]on Sep 27, 2016
Expected Behaviour:
When activating a
nav-link, theactivestate gets removed and added to the now activenav-link. Therefore, the active state gets removed and added to theactiveitem. Additionally the content transitions between the current and now active.Problem:
The active class is not being removed from
nav-link. Thus each item can only be navigated to once.Codepen ( UPDATED ) :
http://codepen.io/anon/pen/ALRGqj?js-preprocessor=none
I hope the syntax is correct since there is no example in the docs:
edit: May be related to #20039 , but tabs work, pills (stacked) dont