Next Tabs

First Tab

Second Tab

Third Tab

How it works

Next Tabs element contains a Morphing Nav element that acts as the Tabs navigator. Next Tabs also has “Tab” elements. You can place the content you want at each “Tab” element.
The number of Morphing Items at Morphing Nav must match the number of “Tab” elements.
Next Tabs Active tab control should match Morphing Nav’s Active Item control for a proper navigation understanding.

Settings controls

Active tab: determines the tab to display when page loads. e.g: “1” will display first tab on page load.

Animation controls

Tabs entrance transition can be customized using opacity, translate X and translate Y controls at pleasure. They will share the duration and CSS easing set.
Duration
CSS easing: you can set any custom CSS easing of your own. Learn more about CSS easings here.

-Tamu

On this page