< DHTMLX Suite 8.3: Colorpicker Transparency Scale, Extended Functionality of Columns’ Header and Footer in Grid/TreeGrid, and More

JavaScript Menu

An easy-to-use set of JavaScript/HTML menu and context menu components for handy navigation with flexible customization.
Part of the all-encompassing Suite UI library.

Product Features

  • Custom HTML content
  • Cross-browser compatibility
  • Full control with JavaScript API
  • Wide customization opportunities
  • Ability to add a context menu
  • Ability to add spacers and separators
  • Ability to hide/show menu options
  • Accessibility support
  • Ability to disable/enable menu options
  • Ability to rearrange menu options
  • Ability to attach a context menu to an HTML object or a mouse event
  • Data loading in the JSON format
  • Hotkeys support
  • Custom icons for menu items

How to Initialize a JavaScript Menu

Take 5 simple steps to create a JavaScript/HTML Menu with DHTMLX on the fly:
1
Create an HTML file
2
Include the Menu source files in the header
3
Add a container with an id - e.g. “menu_container”
4
Initialize the widget with the dhx.Menu object constructor
5
Optionally, specify the configuration properties you need

Why Choose JavaScript/HTML Menu by DHTMLX?

A convenient menu and context menu

dhtmlxMenu allows you to create a modern and user-friendly navigation bar for your application or website in a matter of minutes. You can easily initialize a JavaScript dropdown menu or a right click (context) menu and load the necessary menu options from JSON. Among the available controls, there are menu items, spacers, and separators.

Easily manageable via JavaScript API

The work with our HTML menu bar and context menu is pretty straightforward. You are free to equip menu items with icons and keyboard shortcuts for enhancing the navigation experience. It’s possible to determine whether to attach a context menu to an HTML element or a mouse event. Due to a variety of methods, you can also hide or show, disable or enable, add, remove, and rearrange menu items.

Custom styles to match your app

All DHTMLX components, including a JavaScript menu, are highly customizable. Changing their appearance is smooth and simple via CSS. You only need to create new CSS classes with custom styles. Thus, you can modify the size, background, borders, hover selector, etc. of menus. Besides, you can apply a custom icon font pack instead of the default Material-based one.

Support for Angular, React, and Vue.js

For a plain integration of dhtmlxMenu and other Suite components into web apps based on different client-side frameworks, we have developed a set of wrappers for Angular, React, and Vue.js. You can evaluate them during a 30-day free trial version with the help of our technical support team, samples, and guides in the documentation.

Support & Learning Resources

We provide comprehensive documentation with technical samples. Moreover, our dedicated support team is fast and qualified. Find the suitable way to get support:

Other Suite Components

demo-screenshot

File manager built with the help of Suite widgets: Layout, Grid, DataView, Toolbar, etc.

Try All UI Widgets for Free

All JavaScript UI widgets are part of the DHTMLX Suite library. You can download a free trial version and benefit from:

30 days of free evaluation

Official technical support

Full toolkit of 23 components

PRO features

Need help with dhtmlxMenu integration into your app? Contact us