AMP html - 每隔几秒定期将一张图片切换到另一张图片
AMP html - switch an image to another image periodically every a few seconds
我想在 AMP 上每隔几秒将一张图片切换到另一张图片。
我已经尝试使用 amp-script，例如，更改它的 src、backgroundImage，或者附加一个新的 img 更高的 z-index隐藏上一张图片。
但是都失败了，控制台说：
[amp-script] amp-script[script="main"].js was terminated due to illegal mutation.
或
[amp-script] Sanitized [src]="./gallery1.jpeg": ...
那么，是否可以在 AMP 中将一张图片切换为另一张图片？如果是，怎么做？
您不能为此使用 amp-script，因为您必须自行改变 DOM，而不是通过 AMP 无法实现的用户交互。
您可以通过动画 CSS 实现此目的（如果您需要图像循环）。
您有多种选择：
使用 amp-carousel（虽然它会有幻灯片动画）：
使用 amp-script：具有 [layout!="container"] 且高度 < 300px 的 amp-script 元素始终接受突变。
定义一个 CSS 循环显示图像的动画（例如 here is a sample 在 AMP 中的工作方式相同）。
我建议使用 1. 或 3.，因为它们最容易实现且运行时开销最少。
我想在 AMP 上每隔几秒将一张图片切换到另一张图片。
我已经尝试使用 amp-script，例如，更改它的 src、backgroundImage，或者附加一个新的 img 更高的 z-index隐藏上一张图片。
但是都失败了，控制台说：
[amp-script] amp-script[script="main"].js was terminated due to illegal mutation.
或
[amp-script] Sanitized [src]="./gallery1.jpeg": ...
那么，是否可以在 AMP 中将一张图片切换为另一张图片？如果是，怎么做？
您不能为此使用 amp-script，因为您必须自行改变 DOM，而不是通过 AMP 无法实现的用户交互。
您可以通过动画 CSS 实现此目的（如果您需要图像循环）。
您有多种选择：
使用 amp-carousel（虽然它会有幻灯片动画）：
使用 amp-script：具有 [layout!="container"] 且高度 < 300px 的 amp-script 元素始终接受突变。
定义一个 CSS 循环显示图像的动画（例如 here is a sample 在 AMP 中的工作方式相同）。
我建议使用 1. 或 3.，因为它们最容易实现且运行时开销最少。