Fatal编程技术网
  • amp-html/
  • Amp html 如何使用timeUpdate事件的时间值触发AMP动画？

Amp html 如何使用timeUpdate事件的时间值触发AMP动画？

amp-html

Amp html 如何使用timeUpdate事件的时间值触发AMP动画？,amp-html,Amp Html,。然而，如何使用时间值还不清楚 我有amp动画，我想在不同的时间触发。在JavaScript中，我会将该时间值传递给事件处理程序，并根据该时间值触发动画 如何在AMP中执行类似操作 假设动画可以表示为： 步骤1 将动画需要触发的时间转换为百分比偏移。例如，如果要以45秒触发动画，且视频长度为1m20秒，则偏移量为45/80=0.5625： <amp-animation id="myAnimation" ...> <script type="application/json"

。然而，如何使用时间值还不清楚

我有amp动画，我想在不同的时间触发。在JavaScript中，我会将该时间值传递给事件处理程序，并根据该时间值触发动画


如何在AMP中执行类似操作
 假设动画可以表示为：

步骤1

将动画需要触发的时间转换为百分比偏移。例如，如果要以45秒触发动画，且视频长度为1m20秒，则偏移量为45/80=0.5625：


<amp-animation id="myAnimation" ...>
  <script type="application/json">
    {
      // ...
      "animations": [{
        "opacity": 1,
        "offset": 0.5625
      }]
    }
  </script>
</amp-animation>


有关更多详细信息，请参阅

（请注意，这种方法在AMP故事的上下文中不起作用，因为
。操作和事件也不受支持。）


<amp-video on="timeUpdate:myAnimation.seekTo(percent=event.percent)" ...>
</amp-video>