amp-next-page
Introduction
amp-next-page allows you to add an infinite scroll style experience to your AMP pages.
Setup
Import the amp-next-page component.
<script async custom-element="amp-next-page" src="https://cdn.ampproject.org/v0/amp-next-page-1.0.js"></script>
Basic usage
This sample uses the amp-next-page component to load other sample pages. It defines a custom separator.
<amp-next-page>
<script type="application/json">
[
{
"title": "amp-img",
"image": "https://preview.amp.dev/static/samples/img/amp.jpg",
"url": "/documentation/examples/components/amp-img/"
},
{
"title": "amp-bind",
"image": "https://preview.amp.dev/static/samples/img/amp.jpg",
"url": "/documentation/examples/components/amp-bind/"
},
{
"title": "amp-accordion",
"image": "https://preview.amp.dev/static/samples/img/amp.jpg",
"url": "/documentation/examples/components/amp-accordion/"
},
{
"title": "amp-lightbox-gallery",
"image": "https://preview.amp.dev/static/samples/img/amp.jpg",
"url": "/documentation/examples/components/amp-lightbox-gallery/"
},
{
"title": "amp-list",
"image": "https://preview.amp.dev/static/samples/img/amp.jpg",
"url": "/documentation/examples/components/amp-list/"
}
]
</script>
<div class="amp-next-page-sample-separator" separator>
amp-next-page separator
</div>
</amp-next-page>
Требуются дальнейшие объяснения?
Если на этой странице нет ответов на все ваши вопросы, обратитесь к другим пользователям AMP и обсудите свой конкретный сценарий использования.
Перейти на Stack Overflow Не нашли пояснения к функции?Проект AMP активно поощряет ваше участие и сотрудничество! Мы надеемся, что вы станете постоянным участником нашего открытого сообщества, но разовые вклады в работу над задачами, которые вам особенно интересны, также приветствуются.
Редактировать пример на GitHub