docs: function (evt) {
          if (this.element && this._container && this._outline) {
              // Measure the inner element.
              var height = this.element.getBoundingClientRect().height;
              var width = this.element.getBoundingClientRect().width;
  
              if(!width){
                  var left = this.element.getBoundingClientRect().left;
                  var right = this.element.getBoundingClientRect().right;
                  width = right - left;
              }
  
              if(!height){
                  var top = this.element.getBoundingClientRect().top;
                  var bottom = this.element.getBoundingClientRect().bottom;
                  height = bottom - top;
              }
  
              // Apply the inner element's size to the container and outline.
              this._container.style.width = width + 'px';
              this._container.style.height = height + 'px';
              this._outline.style.width = width + 'px';
              this._outline.style.height = height + 'px';
  
              var transitionDuration = 0.24;
  
  
              // Calculate transition delays for individual menu items, so that they fade
              // in one at a time.
              var items = this.element.querySelectorAll('.u-menu-item');
              for (var i = 0; i < items.length; i++) {
                  var itemDelay = null;
                  if (u.hasClass(this.element, 'u-menu-top-left') || u.hasClass(this.element, 'u-menu-top-right')) {
                      itemDelay = ((height - items[i].offsetTop - items[i].offsetHeight) /
                          height * transitionDuration) + 's';
                  } else {
                      itemDelay = (items[i].offsetTop / height * transitionDuration) + 's';
                  }
                  items[i].style.transitionDelay = itemDelay;
              }
  
              // Apply the initial clip to the text before we start animating.
              this._applyClip(height, width);
  
              // Wait for the next frame, turn on animation, and apply the final clip.
              // Also make it visible. This triggers the transitions.
              if(window.requestAnimationFrame){
                  window.requestAnimationFrame(function () {
                      u.addClass(this.element, 'is-animating');
                      this.element.style.clip = 'rect(0 ' + width + 'px ' + height + 'px 0)';
                      u.addClass(this._container, 'is-visible');
                  }.bind(this));
              }else{
                  u.addClass(this.element, 'is-animating');
                  this.element.style.clip = 'rect(0 ' + width + 'px ' + height + 'px 0)';
                  u.addClass(this._container, 'is-visible');
              }
                  
  
              // Clean up after the animation is complete.
              this._addAnimationEndListener();
  
              // Add a click listener to the document, to close the menu.
              var firstFlag = true;
              var callback = function (e) {
                  if(u.isIE8){
                      if(firstFlag){
                          firstFlag = false;
                          return
                      }
                  }
                  if (e !== evt && !this._closing && e.target.parentNode !== this.element) {
                      u.off(document,'click', callback);
                      // document.removeEventListener('click', callback);
                      this.hide();
                  }
              }.bind(this);
              u.on(document,'click', callback);
              // document.addEventListener('click', callback);
          }
      }