docs: function (stateName) {
              this.$Frame.changeState.call(this, stateName); // this must be
              // called before
              // assigning
              // cssPrefix
              var cfg = this._cfg, cssPrefix = this._cssPrefix, tr, td, getDomElementChild = ariaUtilsDom.getDomElementChild;
  
              this._computeSize();
  
              var tds = this._tds;
              if (!tds) {
                  tds = [];
                  this._tds = tds;
                  var tbody = getDomElementChild(this._domElt, 0);
                  // Line 1
                  tr = getDomElementChild(tbody, 0);
                  td = getDomElementChild(tr, 0);
                  tds.push({
                      element : td,
                      cssPart1 : 'tlc ',
                      cssPart2 : 'bkgA'
                  });
                  td = getDomElementChild(tr, 1);
                  tds.push({
                      element : td,
                      cssPart1 : 'ts ',
                      cssPart2 : 'bkgB'
                  });
                  td = getDomElementChild(tr, 2);
                  tds.push({
                      element : td,
                      cssPart1 : 'trc ',
                      cssPart2 : 'bkgA'
                  });
                  // Line 2
                  tr = getDomElementChild(tbody, 1);
                  td = getDomElementChild(tr, 0);
                  tds.push({
                      element : td,
                      cssPart1 : 'ls ',
                      cssPart2 : 'bkgC'
                  });
                  td = getDomElementChild(tr, 1);
                  tds.push({
                      element : td,
                      cssPart : 'm'
                  });
                  td = getDomElementChild(tr, 2);
                  tds.push({
                      element : td,
                      cssPart1 : 'rs ',
                      cssPart2 : 'bkgC'
                  });
                  // Line 3
                  tr = getDomElementChild(tbody, 2);
                  td = getDomElementChild(tr, 0);
  
                  tds.push({
                      element : td,
                      cssPart1 : 'blc ',
                      cssPart2 : 'bkgA'
                  });
                  td = getDomElementChild(tr, 1);
                  tds.push({
                      element : td,
                      cssPart1 : 'bs ',
                      cssPart2 : 'bkgB'
                  });
  
                  td = getDomElementChild(tr, 2);
  
                  tds.push({
                      element : td,
                      cssPart1 : 'brc ',
                      cssPart2 : 'bkgA'
  
                  });
  
              }
  
              var sizeInfo = {
                  className : 'xFrameContent ' + cssPrefix + 'c ' + cfg.cssClass
              };
              this._appendInnerSizeInfo(sizeInfo);
              this._childRootElt.style.width = sizeInfo.width;
              this._childRootElt.style.height = sizeInfo.height;
              this._childRootElt.className = sizeInfo.className;
  
              for (var i = 0, l = tds.length; i < l; i++) {
                  td = tds[i];
                  if (td.cssPart) {
                      td.element.className = cssPrefix + 'm';
                  } else {
                      td.element.className = cssPrefix + td.cssPart1 + cssPrefix + td.cssPart2;
                  }
                  // frameIcons update
                  if (i == 1) {
                      td.element.innerHTML = this.__addFrameIcon(cfg, cssPrefix, 'top');
                  }
                  if (i == 7) {
                      td.element.innerHTML = this.__addFrameIcon(cfg, cssPrefix, 'bottom');
                  }
              }
          }