Accessible tabbed content that loops automatically from one item to the next.
All components are based on CodyFrame.
This component includes variations. All variations share the same SCSS/JS code. They only differ in their HTML.
The Looping Tabs component is used to group related content, and change its visibility using labels - so that only the selected content panel is visible. It automatically loops from one panel to the next one.
If you want to change the duration of the loop, add a
data-autoplay-interval to the
.loop-tabs element; set it equal to the custom duration (in milliseconds) that you want to use (default is 5000).
If you want to turn the autoplay off, add a
data-autoplay="off" to the