cferdinandi / tabby

Lightweight, accessible vanilla JS toggle tabs.
MIT License
604 stars 73 forks source link

Callback events? #104

Closed kyotoprotokollet closed 5 years ago

kyotoprotokollet commented 5 years ago

I'm wondering if there is any kind of callback event after a tab has been selected that I can listen for? If not, maybe that could be added?

I tried adding an eventListener to 'tabby', but that is called before the tab is actually selected, I want to do something with the tab after it is selected. My goal is to animate in my tab content instead of just turning it on/off directly.

cferdinandi commented 5 years ago

I tried adding an eventListener to 'tabby', but that is called before the tab is actually selected

The event is emitted after Tabby adds/removes all of the classes, but... it is also likely picked up by your event listener before the next repaint happens, which is why it can appear to fire before. See here: https://github.com/cferdinandi/tabby/blob/master/src/js/tabby/tabby.js#L179

For what you're trying to do, though, you'd be better served using some CSS

You can modify the [role="tabpanel"] and [hidden] attribute styles to suit your needs, or add a requestAnimationFrame() to your event listener to wait until after the next repaint if that helps.