×

Navigators



There are many types of navigators that you can use, some include:





This is an example of a Burger Navigator:




Burger Navigators

This example demonstrates how a simple burger naviagtor would look like.

Click on the horizontal three bars in the top right corner, to toggle the menu.

An example of this navigator is at the top of this page


These are created mainly with CSS and with the help of javascript.

in javascript, you specify getElementById. After that, you can change it's width upon press


EG:


function openNav() {
document.getElementById("myNav").style.width = "20%"; }

function closeNav() {
document.getElementById("myNav").style.width = "0%"; }


Burger navigators are usually identified by a





This is an example of Breadcrumbs:



A breadcrumb navigation provide links back to each previous page the user navigated through, and shows the user's current location in a website.

This can be done through a simple < ul> < li> tag with a hrefs inside.


Find out more about anchor links here



Waffle Navigation


Waffle Navigators are usually identified by a 3x3 grid like this:

. . .
. . .
. . .


This Menu Grid is actually an offshoot of Google’s Mobile App navigation.

When you click on the Waffle, a pop-up window opens with a plethora of different apps

Google is now replacing navigation on many of its sites, as well as in it’s web browser Chrome, with this Waffle.