amp-fx-flying-carpet
Description
Wraps its children in a unique full-screen scrolling container allowing you to display a full-screen ad without taking up the entire viewport.
Required Scripts
<script async custom-element="amp-fx-flying-carpet" src="https://cdn.ampproject.org/v0/amp-fx-flying-carpet-0.1.js"></script>
Beispiele
Usage
amp-fx-flying-carpet displays its children inside a container of fixed height.
As the user scrolls the page, the flying carpet reveals more of it contents,
sliding across its children as if peering through a window in the page.
Check if your ad network permits use of flying carpets when implementing the
amp-fx-flying-carpet to display ads.
<amp-fx-flying-carpet height="300px"> <amp-img src="fullscreen.png" width="300" height="500" layout="responsive" ></amp-img> </amp-fx-flying-carpet>
The following requirements are imposed on amp-fx-flying-carpet positioning:
- It should be positioned so that it doesn't obscure the first viewport (outside of top 75%).
- It should be positioned so that its top can reach or be above the top of the last viewport when scrolled.
Attributes
height
The height of the flying carpet's "window".
Common attributes
amp-fx-flying-carpet includes the
common attributes
extended to AMP components.
Styling
You may use the amp-fx-flying-carpet element selector to style it freely.
amp-fx-flying-carpet elements are always position: relative.
Validation
See amp-fx-flying-carpet rules
in the AMP validator specification.
Du hast dieses Dokument mehrmals gelesen, hast aber immer noch Fragen? Vielleicht hatten andere Nutzer das gleiche Problem: Schau doch bei Stack Overflow vorbei und lass dir von ihnen helfen.
Zu Stack Overflow wechseln Möchtest du einen Bug oder ein fehlendes Feature melden?Das AMP Projekt ist auf deine Teilnahme und deine Beiträge angewiesen! Wir hoffen natürlich, dass du dich aktiv an unserer Open Source Community beteiligen wirst. Aber wir freuen uns auch über einmalige Beiträge zu den Themen, die dich besonders interessieren.
Zu GitHub wechseln