Learn about Navigation

Discover the secrets of effective navigation design. Read tutorials on menu design, breadcrumb trails, and site maps, to help users find what they need quickly.
Read more
Read less
All content
Courses
Tutorials

All Navigation content:

  1. Build a Navigation Menu With an Animated Active Indicator (JavaScript)

    Build a Navigation Menu With an Animated Active Indicator (JavaScript)

    Tutorial • Beginner

    Today, we’ll learn how to create a fancy menu effect: each time we click on, or hover over an item there will be a magic moving element that will follow...

  2. The Best Responsive Menu Tutorials on Tuts+

    The Best Responsive Menu Tutorials on Tuts+

    Tutorial • Beginner

    Interested in building a responsive menu for your next project, but need some inspiration? Today we’ll explore the best CSS and JavaScript header menu...

  3. Create a Reusable Dropdown Component with JavaScript

    Create a Reusable Dropdown Component with JavaScript

    Tutorial • Intermediate

    In this tutorial, we’ll create a reusable, custom dropdown component, using vanilla JavaScript.

  4. Create an Animated Sticky Header on Scroll (With a Bit of JavaScript)

    Create an Animated Sticky Header on Scroll (With a Bit of JavaScript)

    Tutorial • Beginner

    In the past, we’ve covered many header scroll effects, and today it’s time for another one! In this tutorial, you’ll learn how to make a header reappear and...

  5. How to Build a Responsive Off-Canvas Menu With CSS and a Touch of JavaScript

    How to Build a Responsive Off-Canvas Menu With CSS and a Touch of JavaScript

    Tutorial • Beginner

    In this tutorial, we’ll go through a simple yet effective method for creating a responsive off-canvas menu with HTML, CSS, and JavaScript.

  6. Build a Multilevel Animated Mobile Menu With JavaScript

    Build a Multilevel Animated Mobile Menu With JavaScript

    Tutorial • Intermediate

    In this tutorial, we'll discuss how to create a three-level deep (multilevel) sliding mobile menu with pure JavaScript.

  7. How to Update UIkit Components

    How to Update UIkit Components

    Tutorial • Intermediate

    In previous tutorials, we covered various UIkit components. Today, we'll work with the Sticky and Dropdown ones and learn how to update them. The process...

  8. How to Implement Pagination with Vanilla JavaScript

    How to Implement Pagination with Vanilla JavaScript

    Tutorial • Intermediate

    In this tutorial, we’ll build a fully functional pagination feature for a website using vanilla JavaScript. We’ll break down the logic into simple functions...

  9. How to Build a Shifting Underline Hover Effect With CSS and JavaScript

    How to Build a Shifting Underline Hover Effect With CSS and JavaScript

    Tutorial • Intermediate

    In today’s tutorial, we’re going to use a little bit of CSS and JavaScript to create a fancy menu hover effect. It’s not a complicated end result, yet...

  10. 10 Best Mega Menu Examples in WordPress Themes

    10 Best Mega Menu Examples in WordPress Themes

    Tutorial • Beginner

    Mega menus can add an extended level of navigation to your WordPress site. Here, we've put together 10 different examples of mega menus in action from...

  11. How to Create a Sticky Toolbar With CSS and a Bit of JavaScript

    How to Create a Sticky Toolbar With CSS and a Bit of JavaScript

    Tutorial • Beginner

    In this new tutorial we’ll learn how to create a sticky (or fixed) toolbar, using CSS and a bit of JavaScript, with animated tooltips, that you can use on...

  12. How to Create Responsive Mega Menus With UIkit

    How to Create Responsive Mega Menus With UIkit

    Tutorial • Intermediate

    Learn how to build responsive mega menus with the UIkit framework, by taking advantage of its Dropdown, Nav, Navbar, and Off-canvas components.

Related Categories

CSS
HTML/CSS
UI Design
Sketch
Unlimited Downloads
From $16.50/month
Get access to over one million creative assets on Envato Elements.
Over 9 Million Digital Assets
Everything you need for your next creative project.
Create Beautiful Logos, Designs
& Mockups in Seconds
Design like a professional without Photoshop.
Join the Community
Share ideas. Host meetups. Lead discussions. Collaborate.
Quick LinksExplore popular categories