Use the Refokus Automatic Tabs tool to enhance the behaviour of the native tab component in Webflow, by automatically navigating through the individual tab panes.
[.c-text_step] Paste the following script in the “Before tag” field under the “Custom Code” section in the page settings. [.c-text_step]
Everything is made using custom attributes, so when we say “Add” that means “Add a custom attribute”.
To start, set up your tabs component inside of Webflow. Remember, you are able to use the interactions panel to animate with the animation type: Tab Change to create any transition/animation you want.
Next, we need to add a custom attribute of [.c-tool_tag]r-automatic-tabs=1[.c-tool_tag] on the ‘Tabs Menu’ element inside the component. The attribute value (ie. the ‘=1’) also controls the amount of seconds it takes to automatically change the tab.
Next step, publish the site, and watch your tabs automatically navigate!