Method transferTo

src/service/fixed-layer.js:1071–1124

@override

(fe, index, state)

  /** @override */
  transferTo(fe, index, state) {
    const {element} = fe;
    if (element.parentElement == this.layer_) {
      return;
    }

    dev().fine(TAG, 'transfer to fixed:', fe.id, fe.element);
    user().warn(
      TAG,
      'In order to improve scrolling performance in Safari,' +
        ' we now move the element to a fixed positioning layer:',
      fe.element
    );

    if (!fe.placeholder) {
      // Never been transferred before: ensure that it's properly configured.
      setStyle(element, 'pointer-events', 'initial');
      const placeholder = (fe.placeholder =
        this.doc_.createElement('i-amphtml-fpa'));
      toggle(placeholder, false);
      placeholder.setAttribute('i-amphtml-fixedid', fe.id);
    }

    // Calculate z-index based on the declared z-index and DOM position.
    setStyle(
      element,
      'zIndex',
      `calc(${10000 + index} + ${state.zIndex || 0})`
    );

    // Identify lightboxed elements so they can be visible when the transfer
    // layer is "hidden", and hidden with the transfer layer is "visible".
    if (fe.lightboxed) {
      element.classList.add(LIGHTBOX_ELEMENT_CLASS);
    }

    element.parentElement.replaceChild(fe.placeholder, element);
    this.layer_.appendChild(element);

    // Test if the element still matches one of the `fixed` selectors. If not
    // return it back to BODY.
    const matches = fe.selectors.some((selector) =>
      this.matches_(element, selector)
    );
    if (!matches) {
      user().warn(
        TAG,
        'Failed to move the element to the fixed position layer.' +
          ' This is most likely due to the compound CSS selector:',
        fe.element
      );
      this.returnFrom(fe);
    }
  }

  /** @override */
  returnFrom(fe) {