我正在实施放大器故事。
案例:我们在 Instagram 上有很多故事,我们正在将它们迁移到网站上的 amp 故事中。
我正在使用 amp-story,但 amp-img 和 amp-video 的响应有问题。
我认为“响应式”运行良好,因为如果我在 Playground.amp.dev 上对其进行了很好的测试。但是当您在移动设备(chrome 浏览器或 safari 浏览器)上看到图像或视频时,它并不完美。两种情况下的地址栏切掉图像的顶部,如果是 safari,它也会在底部切掉。在 safari mobile 上 40px 和 chrome mobile 上 80px 不算太多。但对于某些图像来说很重要。
有没有机会在不丢失像素的情况下临时隐藏地址栏或调整图像大小?
另一个测试:我为您的图层使用 template="vertical" 和 layout="responsive" 进行了测试,但它使图像非常小并添加了太多颜色背景。
完整测试示例:https ://www.recalculandoviajes.com/amp/poland-test.html
amp-img 标签示例:
<amp-story-page id="cover" auto-advance-after="5s">
<amp-story-grid-layer template="fill">
<amp-img src="https://www.recalculandoviajes.com/wp-content/uploads/images/Varsovia-Recalculando-04.jpg" width="1080" height="1920" layout="responsive">
</amp-img>
</amp-story-grid-layer>
</amp-story-page>
amp-video 标签示例:
<amp-story-page id="page6" auto-advance-after="video3">
<amp-story-grid-layer template="fill">
<amp-video id="video3" autoplay width="639" height="1136" layout="responsive" poster="https://www.recalculandoviajes.com/wp-content/uploads/images/Varsovia-Recalculando-05p.jpg">
<source src="https://www.recalculandoviajes.com/wp-content/uploads/images/Varsovia-Recalculando-05.mp4" type="video/mp4" />
</amp-video>
</amp-story-grid-layer>
</amp-story-page>
我希望不要太松散的像素,并在智能手机上看到图像全垂直屏幕。
有没有机会在不丢失像素的情况下临时隐藏地址栏或调整图像大小?
你有什么建议吗?这是一个错误(不考虑浏览器地址栏)?
非常感谢您!