Skip to content

Commit

Permalink
Update iframe placement docs
Browse files Browse the repository at this point in the history
  • Loading branch information
camelburrito committed Jan 6, 2016
1 parent 546bb86 commit be0ad4d
Showing 1 changed file with 22 additions and 1 deletion.
23 changes: 22 additions & 1 deletion docs/include_features.md
Original file line number Diff line number Diff line change
Expand Up @@ -14,7 +14,7 @@ Display an iframe in your page using the

`amp-iframe` requirements:

* Must be at least 600px or 75% of the first viewport away from the top.
* Must be at least 600px or 75% of the first viewport away from the top (except for `click-to-play` iframes as described below).
* Can only request resources via HTTPS, and they must not be in the same origin as the container,
unless they do not specify allow-same-origin.

Expand All @@ -37,6 +37,27 @@ An example `amp-iframe` from the
</amp-iframe>
```

* It is possible to have an `amp-iframe` appear on the top of a document when the `amp-ifame` has a `placeholder` element as shown in the example below.

```html
<amp-iframe width=300 height=300
layout="responsive"
sandbox="allow-scripts"
src="https://foo.com/iframe">
<amp-img layout="fill" src="https://foo.com/foo.png" placeholder></amp-img>
</amp-iframe>
```
- The `amp-iframe` must contain an element with the `placeholder` attribute, (for instance an `amp-img` element) which would be rendered as a placeholder till the iframe is ready to be displayed.
- Iframe readiness will be inferred by listening to `onload` of the iframe or an `embed-ready` postmesssage which would be sent by the Iframe document, whichever comes first.

Example of IFrame embed-ready request:
```javascript
window.parent./*OK*/postMessage({
sentinel: 'amp',
type: 'embed-ready'
}, '*');
```

# Media

Include images, video, and audio in your page using AMP media elements.
Expand Down

0 comments on commit be0ad4d

Please sign in to comment.