JavaScript/jQuery ContextMenu - Overview
The ContextMenu UI component displays a single- or multi-level context menu. An end user invokes this menu by a right click or a long press.
The following code adds the ContextMenu UI component to your page and binds it to an image using the target property. Note that the data source of the UI component declares several nesting levels. Items in the resulting context menu mirror this structure.
JavaScript
HTML
- var contextMenuItems = [
- { text: 'Zoom In' },
- { text: 'Zoom Out' },
- {
- text: 'Share',
- items: [{
- text: 'Send to a friend',
- items: [
- { text: 'Log in with Facebook' },
- { text: 'Log in with Twitter' }
- ]
- }, {
- text: 'Send to a group',
- items: [
- { text: 'Log in with Facebook' },
- { text: 'Log in with Twitter' }
- ]
- }]
- },
- { text: 'Comment' }
- ];
- $(function() {
- $("#contextMenuContainer").dxContextMenu({
- items: contextMenuItems,
- target: "#someImage"
- });
- });
- <img id="someImage" src="http://here/goes/my.jpg">
- <div id="contextMenuContainer"></div>
See Also
Feel free to share topic-related thoughts here.
If you have technical questions, please create a support ticket in the DevExpress Support Center.
Thank you for the feedback!
If you have technical questions, please create a support ticket in the DevExpress Support Center.