JqxMenu: Difference between revisions
Jump to navigation
Jump to search
Add javascript snippet |
|||
Line 9: | Line 9: | ||
http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxmenu/jquery-menu-getting-started.htm | http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxmenu/jquery-menu-getting-started.htm | ||
== Example == | == Example (Basic) == | ||
<pre> | <pre> | ||
Line 34: | Line 34: | ||
Menu1_settings.source=source | Menu1_settings.source=source | ||
Menu2_settings.source=source | Menu2_settings.source=source | ||
</pre> | |||
== Example (JavaScript) == | |||
<pre> | |||
function Main() { | |||
$("#Menu1").jqxMenu(Menu1_settings); | |||
$("#Menu2").jqxMenu(Menu2_settings); | |||
} | |||
Menu1.onitemclick = function(event) { | |||
menuItemText=$(event.target).text(); | |||
console.log(menuItemText); | |||
} | |||
source = [ {label: "Home" }, {label: "Products" , items: [ {label: "Product A" }, {label: "Product B" } ] }, {label: "Purchase" }, {label: "Contact Us" }, {label: "About Us"}]; | |||
Menu1_settings.source=source; | |||
Menu2_settings.source=source; | |||
</pre> | </pre> | ||
Revision as of 23:02, 27 May 2013
Description
jqxMenu represents a jQuery menu widget that makes it easy to add menus to your app. With the jqxMenu you can create website menus, customized context menus, or application-style menu bars with just a small amount of scripting.
Properties and Methods
See the complete documentation at jqWidget's site: http://www.jqwidgets.com/jquery-widgets-documentation/documentation/jqxmenu/jquery-menu-getting-started.htm
Example (Basic)
Sub Main() $("#Menu1").jqxMenu(Menu1_settings) $("#Menu2").jqxMenu(Menu2_settings) End Sub Function Menu1_onitemclick(event) menuItemText=$(event.target).text() console.log(menuItemText) End Function source = [ _ {label: "Home" }, _ {label: "Products", items: [ _ {label: "Product A" }, _ {label: "Product B" } ] _ }, _ {label: "Purchase" }, _ {label: "Contact Us" }, _ {label: "About Us"}] Menu1_settings.source=source Menu2_settings.source=source
Example (JavaScript)
function Main() { $("#Menu1").jqxMenu(Menu1_settings); $("#Menu2").jqxMenu(Menu2_settings); } Menu1.onitemclick = function(event) { menuItemText=$(event.target).text(); console.log(menuItemText); } source = [ {label: "Home" }, {label: "Products" , items: [ {label: "Product A" }, {label: "Product B" } ] }, {label: "Purchase" }, {label: "Contact Us" }, {label: "About Us"}]; Menu1_settings.source=source; Menu2_settings.source=source;
Output
See above.