only show/hide menu when not shown/hidden (so that events are not bound/unbound twice)

build/css/ox.ui.modern.css

@@ -5,8 +5,10 @@ body.OxThemeModern {
     color: rgb(240, 240, 240);
 }
 .OxThemeModern .OxHighlight {
-    background: rgb(255, 255, 0);
+    //background: rgb(255, 255, 0);
-    color: rgb(0, 0, 0);
+    //font-weight: bold;
+    //color: rgb(0, 0, 0);
+    color: rgb(255, 255, 0);
 }
 
 /*

build/js/ox.ui.js

@@ -1999,6 +1999,7 @@ requires
         }
 
         function onClick(event, data) {
+            Ox.print("onClick", data);
             that.$input.focus().val(Ox.stripTags(data.title));
             self.autocompleteMenu.hideMenu();
             submit();
@@ -3821,6 +3822,9 @@ requires
         };
 
         that.hideMenu = function() {
+            if (that.is(":hidden")) {
+                return;
+            }
             $.each(that.submenus, function(i, submenu) {
                 if (submenu.is(":visible")) {
                     submenu.hideMenu();
@@ -3861,6 +3865,9 @@ requires
         };
 
         that.showMenu = function() {
+            if (!that.is(":hidden")) {
+                return;
+            }
             if (!self.options.parent && !that.$layer.parent().length) {
                 that.$layer.appendTo($body);
             }

demos/test/list.js

@@ -290,7 +290,7 @@ $(function() {
                 }
             },
             clear: true,
-            highlight: false,
+            highlight: true,
             id: "find",
             label: [
                 { id: "all", title: "Find: All" },
@@ -369,8 +369,8 @@ $(function() {
             ],
             menus: [
                 {
-                    id: "demo",
+                    id: "oxdb",
-                    title: "Demo",
+                    title: "OxDB",
                     items: [
                         { id: "about", title: "About" }
                     ]