amp-anim

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

用法

amp-anim 组件显示具有优化 CPU 管理的 GIF 动画。

当 amp-anim 组件不在屏幕上时，它允许 AMP 框架减少在其上花费的资源。否则，amp-anim 的行为与 amp-img 相同。您可以实现一个 占位符元素来进一步优化 amp-anim。

<amp-anim width="400" height="300" src="my-gif.gif">
  <amp-img placeholder width="400" height="300" src="my-gif-screencap.jpg">
  </amp-img>
</amp-anim>

属性

src

指定 GIF 图像的 URL。

在 AMP 电子邮件中，src 必须指向绝对 https URL。在电子邮件中使用 amp-anim 不允许使用以下属性

• srcset
• object-fit
• object-position

alt

出于辅助功能目的，提供备用文本字符串。操作方式与 img 标签上的 alt 属性相同。

attribution

指示图像的归属。例如，attribution="CC courtesy of Cats on Flicker"。

width 和 height

提供图像的明确大小。

常用属性

amp-anim 包括扩展到 AMP 组件的通用属性。

样式

您可以使用 CSS 属性直接设置 amp-anim 的样式。以下示例设置灰色背景占位符

<style amp-custom>
  .amp-anim {
      background-color: grey;
  }
</style>

验证

请参阅 AMP 验证器规范中的amp-anim 规则。