Use hidden attribute rather the 'display: none' for hiding menus.

chrome/browser/resources/shared/js/cr/ui/menu.js

 // Copyright (c) 2012 The Chromium Authors. All rights reserved.
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
 cr.define('cr.ui', function() {
 
   /** @const */ var MenuItem = cr.ui.MenuItem;
 
   /**
    * Creates a new menu element.
    * @param {Object=} opt_propertyBag Optional properties.
    * @constructor
    * @extends {HTMLMenuElement}
    */
   var Menu = cr.ui.define('menu');
 
   Menu.prototype = {
     __proto__: HTMLMenuElement.prototype,
 
     selectedIndex_: -1,
 
     /**
      * Initializes the menu element.
      */
     decorate: function() {
       this.addEventListener('mouseover', this.handleMouseOver_);
       this.addEventListener('mouseout', this.handleMouseOut_);
 
+      this.hidden = true;  // Hide the menu by default.
+
       // Decorate the children as menu items.
       var children = this.children;
       for (var i = 0, child; child = children[i]; i++) {
         cr.ui.decorate(child, MenuItem);
       }
     },
 
     /**
      * Walks up the ancestors of |el| until a menu item belonging to this menu
      * is found.
@@ skipping 102 matching lines @@
    * @type {number}
    */
   cr.defineProperty(Menu, 'selectedIndex', cr.PropertyKind.JS,
       selectedIndexChanged);
 
   // Export
   return {
     Menu: Menu
   };
 });