">文档:<amp-fx-flying-carpet> - amp.dev - AMP 框架
AMP

amp-fx-flying-carpet

描述

将子元素包装在独特的全屏滚动容器中,允许您显示全屏广告,而无需占用整个视口。

 

必需脚本

<script async custom-element="amp-fx-flying-carpet" src="https://cdn.ampproject.org/v0/amp-fx-flying-carpet-0.1.js"></script>

用法

amp-fx-flying-carpet 在固定高度的容器内显示其子元素。当用户滚动页面时,飞毯会显示更多内容,在子元素上滑动,就像通过页面中的窗口窥视一样。

在使用 amp-fx-flying-carpet 显示广告时,请检查您的广告网络是否允许使用飞毯。

<amp-fx-flying-carpet height="300px">
  <amp-img
    src="fullscreen.png"
    width="300"
    height="500"
    layout="responsive"
  ></amp-img>
</amp-fx-flying-carpet>

amp-fx-flying-carpet 定位施加以下要求

  • 应将其定位为不会遮挡第一个视口(超出顶部 75%)。
  • 应将其定位为其顶部在滚动时可以到达或高于最后一个视口的顶部。

属性

高度

飞毯“窗口”的高度。

通用属性

amp-fx-flying-carpet 包含扩展到 AMP 组件的 通用属性

样式

你可以使用 amp-fx-flying-carpet 元素选择器自由地设置其样式。amp-fx-flying-carpet 元素始终为 position: relative

验证

请参阅 AMP 验证器规范中的 amp-fx-flying-carpet 规则

需要更多帮助?

你已经阅读了本文档十几次,但它并没有真正涵盖你的所有问题?也许其他人也有同感:在 Stack Overflow 上联系他们。

转到 Stack Overflow
发现了一个错误或缺少一个功能?

AMP 项目强烈鼓励你的参与和贡献!我们希望你成为我们开源社区的持续参与者,但我们也欢迎针对你特别热衷的问题进行一次性贡献。

转到 GitHub