diff options
| author | maggiewachs <maggie@filamentgroup.com> | 2011-02-24 16:00:01 -0500 |
|---|---|---|
| committer | maggiewachs <maggie@filamentgroup.com> | 2011-02-24 16:00:01 -0500 |
| commit | 75afd3319b98cd19b21027ddc26c700f38841c79 (patch) | |
| tree | db93bf67715cd5c507f2c3bc2a69e16bb940bd53 | |
| parent | f73466a3209f0241a78a550ec89395caa490256a (diff) | |
| download | jquery-ui-75afd3319b98cd19b21027ddc26c700f38841c79.tar.gz jquery-ui-75afd3319b98cd19b21027ddc26c700f38841c79.zip | |
Added a second example to show a menubar with buttons and icons and one without (default)
| -rw-r--r-- | tests/visual/menu/menubar.html | 63 |
1 files changed, 57 insertions, 6 deletions
diff --git a/tests/visual/menu/menubar.html b/tests/visual/menu/menubar.html index bd7ea44ef..d10b83aef 100644 --- a/tests/visual/menu/menubar.html +++ b/tests/visual/menu/menubar.html @@ -27,11 +27,22 @@ $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); } }); + + $(".menubar-icons").menubar({ + menuIcon: true, + buttons: true, + select: function(event, ui) { + $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); + } + }); + + }); </script> - <style> + <style type="text/css"> body { font-size:62.5%; } - .ui-menu { width: 200px; position: absolute; outline: none; } + .menubar { margin: 0 0 4em; } /* style for this page only */ + .ui-menu { width: 200px; position: absolute; outline: none; z-index: 9999; } .ui-menu .ui-icon { float: right; } .ui-menu li.ui-state-disabled { font-weight: bold; @@ -41,16 +52,56 @@ } /* menubar styles */ - .ui-menubar .ui-button { float: left; margin: 0; border-width: 0 !important; border-right-width: 1px !important; } + .ui-menubar .ui-button { float: left; font-weight: normal; border-top-width: 0 !important; border-bottom-width: 0 !important; margin: 0; } .ui-menubar .ui-button.ui-corner-all { -moz-border-radius: 0; -webkit-border-radius: 0; border-radius: 0; } + .ui-menubar .ui-menubar-link { border-right: 1px dashed transparent; border-left: 1px dashed transparent; } + + </style> </head> <body> <div class="menubar"> - <!-- - <a href="#">About...</a> - --> + <a href="#">File</a> + <ul> + <li><a href="#">Open...</a></li> + <li class="ui-state-disabled">Open recent...</li> + <li><a href="#">Save</a></li> + <li><a href="#">Save as...</a></li> + <li><a href="#">Close</a></li> + <li><a href="#">Quit</a></li> + </ul> + <a href="#">Edit</a> + <ul> + <li><a href="#">Copy</a></li> + <li><a href="#">Cut</a></li> + <li class="ui-state-disabled">Paste</li> + </ul> + <a href="#">View</a> + <ul> + <li><a href="#">Fullscreen</a></li> + <li><a href="#">Fit into view</a></li> + <li> + <a href="#">Encoding</a> + <ul> + <li><a href="#">Auto-detect</a></li> + <li><a href="#">UTF-8</a></li> + <li> + <a href="#">UTF-16</a> + <ul> + <li><a href="#">Option 1</a></li> + <li><a href="#">Option 2</a></li> + <li><a href="#">Option 3</a></li> + <li><a href="#">Option 4</a></li> + </ul> + </li> + </ul> + </li> + <li><a href="#">Customize...</a></li> + </ul> +</div> + +<div class="menubar-icons"> <a href="#">File</a> <ul> <li><a href="#">Open...</a></li> |