diff options
| author | jzaefferer <joern.zaefferer@gmail.com> | 2011-03-11 18:13:10 +0100 |
|---|---|---|
| committer | jzaefferer <joern.zaefferer@gmail.com> | 2011-03-11 18:17:28 +0100 |
| commit | 5bc57a82c8a0bf89694ffc0744d9a6d3095b02b9 (patch) | |
| tree | 155e6a4f88eb6f6a9ec60ac146c8dffd8747918d | |
| parent | 5a5a809e7f22d4667c33cad64e18672e33728b75 (diff) | |
| download | jquery-ui-5bc57a82c8a0bf89694ffc0744d9a6d3095b02b9.tar.gz jquery-ui-5bc57a82c8a0bf89694ffc0744d9a6d3095b02b9.zip | |
Menu: Add menubar-with-one-button-in-table example.
| -rw-r--r-- | tests/visual/menu/menubar.html | 75 |
1 files changed, 67 insertions, 8 deletions
diff --git a/tests/visual/menu/menubar.html b/tests/visual/menu/menubar.html index 1519c73fc..930f23cc5 100644 --- a/tests/visual/menu/menubar.html +++ b/tests/visual/menu/menubar.html @@ -22,7 +22,9 @@ top: 10 }).appendTo(document.body).themeswitcher(); - $(".menubar").menubar({ + $("td:has(.menubar)").clone().appendTo("tbody tr:not(:first)"); + + $("#bar1, .menubar").menubar({ select: function(event, ui) { $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); } @@ -35,13 +37,11 @@ $("<div/>").text("Selected: " + ui.item.text()).appendTo("#log"); } }); - - }); </script> <style type="text/css"> body { font-size:62.5%; } - .menubar { margin: 0 0 4em; } /* style for this page only */ + #bar1, #bar2 { 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 { @@ -55,12 +55,18 @@ .ui-menubar .ui-button { float: left; font-weight: normal; border-top-width: 0 !important; border-bottom-width: 0 !important; margin: 0; } .ui-menubar .ui-menubar-link { border-right: 1px dashed transparent; border-left: 1px dashed transparent; } - - </style> + table { + border-collapse: collapse; + } + th, td { + padding: 0.5em; + border: 1px solid black; + } + </style> </head> <body> -<div class="menubar"> +<div id="bar1" class="menubar"> <a href="#">File</a> <ul> <li><a href="#">Open...</a></li> @@ -100,7 +106,7 @@ </ul> </div> -<div class="menubar-icons"> +<div id="bar2" class="menubar-icons"> <a href="#">File</a> <ul> <li><a href="#">Open...</a></li> @@ -140,6 +146,59 @@ </ul> </div> +<table id="movies" class="ui-widget"> + <thead> + <tr> + <th data-field="Name" class="ui-widget-header">Name</th> + <th data-field="ReleaseYear" class="ui-widget-header">Release Year</th> + <th data-field="AverageRating" class="ui-widget-header">Average Rating</th> + <th class="ui-widget-header"></th> + </tr> + </thead> + <tbody> + <tr> + <td class="ui-widget-content">Red Hot Chili Peppers: Funky Monks</td> + <td class="ui-widget-content">1993</td> + <td class="ui-widget-content">3.6</td> + <td class="ui-widget-content"> + <div class="menubar"> + <a href="#">Options</a> + <ul> + <li><a href="#">Order...</a></li> + <li class="ui-state-disabled">Write a Review...</li> + <li><a href="#">Find Similar Movies...</a></li> + <li> + <a href="#">Rate</a> + <ul> + <li><a href="#">5 stars</a></li> + <li><a href="#">4 stars</a></li> + <li><a href="#">3 stars</a></li> + <li><a href="#">2 stars</a></li> + <li><a href="#">1 stars</a></li> + </ul> + </li> + </ul> + </div> + </td> + </tr> + <tr> + <td class="ui-widget-content">Rod Stewart: Storyteller 1984-1991</td> + <td class="ui-widget-content">1991</td> + <td class="ui-widget-content">3.1</td> + </tr> + <tr> + <td class="ui-widget-content">Stevie Ray Vaughan and Double Trouble: Live at the El Mocambo 1983</td> + <td class="ui-widget-content">1991</td> + <td class="ui-widget-content">3.9</td> + </tr> + <tr> + <td class="ui-widget-content">Spike and Mike's Sick & Twisted Festival of Animation</td> + <td class="ui-widget-content">1997</td> + <td class="ui-widget-content">2.6</td> + </tr> + </tbody> +</table> + <div class="ui-widget" style="margin-top:2em; font-family:Arial"> Log: <div id="log" style="height: 400px; width: 300px; overflow: auto;" class="ui-widget-content"></div> |