amp-anim

簡介

使用 amp-anim 將動畫 (gif、webp) 嵌入您的 AMP HTML 檔案中。動畫檔案應透過 HTTPS 載入。

設定

在標頭中匯入動畫元件。

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

基本用法

基本嵌入。amp-anim 的用法與 amp-img 類似。

<amp-anim width="245" height="300" src="/static/samples/img/gopher.gif" alt="an animation" attribution="The Go gopher was designed by Reneee French and is licensed under CC 3.0 attributions.">
</amp-anim>

預留位置

當 src 檔案載入需要時間時，您可以使用 amp-img 作為預留位置。在這種情況下，必須將 placeholder 屬性新增至巢狀的 amp-img。

<amp-anim width="245" height="300" src="/static/samples/img/gopher.gif" alt="an animation" attribution="The Go gopher was designed by Reneee French and is licensed under CC 3.0 attributions.">
  <amp-img placeholder width="245" height="300" src="/static/samples/img/gopher.png"></amp-img>
</amp-anim>

需要更進一步的說明嗎？

如果本頁的說明無法解答您的所有疑問，請隨時與其他 AMP 使用者聯繫，討論您的確切使用案例。

前往 Stack Overflow

未說明的特色功能？

AMP 專案強烈鼓勵您的參與和貢獻！我們希望您能成為我們開放原始碼社群的持續參與者，但我們也歡迎您針對您特別感興趣的問題做出一次性的貢獻。

在 GitHub 上編輯範例

由 @sebastianbenz 撰寫