Webflow Tabs

Change Tab Dynamically

Overview
How to create CMS-powered tabs
Add Next / Prev Buttons to Tabs
Change Tab Dynamically
Autoplay Tabs
Circular / Orbital Tabs
11:41
401
No items found.
Published
July 8, 2023
Updated
in lightbox

Let's say you want to be able to change the selected tab based on;

  • Something else happening on the page, such as the user clicking on a button.
  • Specific indications in the URL such as ?tab=mango .

Technical

There are at least two ways to change Webflow's tabs.

Either can be triggered by page-load checking the querystring

Javascript Click Approach

Send a click() event to the tab, so that Webflow's javascript acts accordingly.

In this example you'd have a button with the ID my-button, and your tab would have the ID my-tab3.

Javascript Class Change Approach

From Timothy Ricks;

Videos
No items found.
Table of Contents
Comments
Did we just make your life better?
Passion drives our long hours and late nights supporting the Webflow community. Click the button to show your love.