Open main menu

WebApps with LocalStorage and AppCache/Navigation Menu

Desktop View of Hamburger Menu
Mobile View of Hamburger Menu with opened navigation menu
Mobile View of Hamburger Menu with closed navigation menu and visible page "Home"
Load Icon from Wiki Commons

This learning resource is about creating a menu for navigation. The menu will contain 3 types of menu items:

  • (Page) is basically HTML content that is displayed when you click on the menu item (check Home, News, Contact as examples in hamburger_menu_app)
  • (Script Call) triggers an event to execute a script defined in the AppLSAC. Click on [Script-Call] in the menu.
  • (Link) Clicking on the menu item refers to other local HTML pages, that could perform a specific tasks and the user will leave the AppLSAC.

Learning TasksEdit

Explore Structure of Navigation MenuEdit

A Navigation Menu Demo and GitHub-ZIP file[1] was created for this learning resource. The following learning task refers to hamburger_menu_app example:

Create your first Navigation MenuEdit

Using Icons for AppLSACsEdit

See alsoEdit

ReferencesEdit

  1. GitHub Repository hamburger_menu_app (2019) E. Niehaus - created for this AppLSAC learning resource - Demo URL: https://niebert.github.io/hamburger_menu_app - ZIP - accessed 2019/08/14
  2. GitHub Repository JSONEditor4Menu (2019) E. Niehaus - created for this AppLSAC learning resource - Demo URL: https://niebert.github.io/hamburger-menu-creator - ZIP - accessed 2019/08/16
  3. GitHub Repository hamburger_menu_app (2019) E. Niehaus - created for this AppLSAC learning resource - Demo URL: https://niebert.github.io/icons4menu - ZIP - accessed 2019/09/15