Marketplace
Made in Webflow

Seamless Page Tabs

1423 views
site profile thumbnail

Description

Each icon on this fixed nav element links to a new page which loads seamlessly. This is valuable for analytics or conversion tracking while keeping the experience seamless. Responsive menu adapts to bottom of screen on mobile for ease of use as well. Enjoy! ____________ To customize the menu - 1- Open the symbol and change the icon image and label 2- Change individual page names to match menu labels 3- Change accent color swatches 4- Build out page content To add a new page - 1- Copy the "icon wrap" element in the menu to create a new page link 2- Edit the icon image and label 3- Be sure "Menu transition" interaction is active on the icon wrap link 4- Create a new page and add a page load animation 4.1- When page starts loading should be set to - "Page Loader" interaction 4.2- When page finishes loading should be set to - "Page Open" interaction Leave a comment if you have any questions and check custom code section for Javascript snippet.
Feeling inspired?If this Made In Webflow site sparked some inspo, why not get started on a project of your own? Clone a site, purchase a template or start building from scratch.
tabsmenunavigationseamlesspageloadinteractionsjavascriptload-more

More by Raymmar Tirado

See profile
View details
Card Fan on Hover
451
931