@synqro/tab-cycler v1.0.0

@synqro/tab-cycler

Create an automatic rotating tab experience in Webflow (or any site) with customizable timing, optional disabling of clicks, and external link support.

Installation

1. Add the following script to your Webflow project:

   <script src="https://cdn.jsdelivr.net/npm/@synqro/tab-cycler@1/dist/index.min.js"></script>

2. Create your tab structure in Webflow:

   <div class="w-tabs" sl-tab-list>
     <a class="w-tab-link w--current" data-w-tab="Tab 1">Tab 1</a>
     <a class="w-tab-link" data-w-tab="Tab 2" sl-tab-click="none"
       >Tab 2 (désactivé)</a
     >
     <a class="w-tab-link" data-w-tab="Tab 3">Tab 3</a>
   </div>

3. Add or adjust these custom attributes to control behavior:

   Attribute	Value	Description
   sl-tab-list		Activate the tab cycler
   sl-tab-timer	5 (seconds)	Time between tab change (default: 5 seconds)
   sl-tab-click	none or http(s)://...	Disable tab clicks or link to external URL
   sl-tab-target	blank or self	Open external link in new tab or same tab

4. Publish your Webflow project