AMP Carousel动态高度

时间:2016-12-06 10:12:42

标签: amp-html

我的页面中有一个amp-carousel元素,但在渲染之前我不知道它的高度。如果我使用layout="responsive"高度显然是错误的,因为我没有正确的宽度/高度比 - 我使用100px

还有其他选择吗?我试过layout="flex-item",但完全破坏了旋转木马。

2 个答案:

答案 0 :(得分:2)

Dima Voytenko在此GitHub post中提及,

  

layout=responsive本质上意味着"响应宽度"。它采用所有可用宽度并根据纵横比自动计算高度。

但请注意layout=responsive仅在slides类型的轮播上受支持。 (参考:amp-carousel

有了这个,你可以选择考虑使用这个例子:

<amp-carousel width="100" height="100" controls layout="responsive" type="slides">

您可以查看此link以获取更多示例。

最后,您可能还想访问以下内容以获取更多信息:

答案 1 :(得分:0)

对于具有响应式布局的图像,不必了解图像的宽度和高度。您应该匹配的是图像的宽高比(如果您事先获得此数据我不知道)。请参阅&#34;设置宽高比&#34;这里https://www.ampproject.org/es/docs/reference/components/amp-img

如果您没有纵横比,则应使用服务器端代码来确定此比率或图像的尺寸。

Dinamically或自动AMP不会为您设置图像的宽度或高度,因为这种HTML可以避免重新绘制和其他昂贵的东西来快速加载页面。

希望有所帮助。