# Enhanced Picture-in-Picture

### Standard vs enhanced Picture-in-Picture

Firework player supports two different Picture-in-Picture (PiP) modes: standard and enhanced.

By default, the player uses the standard PiP mode. The player can turn into a floating player and allow you to browse the web page while keeping the playback in the corner. However, when you navigate away to a different page, the video playback may be interrupted depending on the setting of the targeted page.

You can enable enhanced Picture-in-Picture (PiP) by setting the player attribute `pip="true"` or asking the partner success team to update the channel config. When enhanced PiP is enabled, and you navigate to other pages on the same domain, the unmuted playback will be carried over seamlessly.

For enhanced PiP to work, some prerequisites are explained in the next section.

### Enhanced Picture in Picture mode requirements

Firework’s enhanced Picture-in-Picture feature renders the original page in an iframe and places the player on top. Therefore, the [Content-Security-Policy](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy) HTTP header with [frame-ancestors](https://developer.mozilla.org/en-US/docs/Web/HTTP/Headers/Content-Security-Policy/frame-ancestors) directive is needed to render the page in the iframe on the same origin. This can be achieved either by CSP HTTP header or HTML meta tag.

*HTTP header value:*

* `content-security-policy: frame-ancestors 'self'`
* `x-frame-options: SAMEORIGIN`

*HTML meta header tags:*

* `<meta http-equiv="Content-Security-Policy" content="frame-ancestors 'self'">`
* `<meta http-equiv="X-Frame-Options" content="SAMEORIGIN">`

*Please note, x-frame-options is obsolete and should be only used in case you want to support older browsers.*

If CSP blocks the website from rendering in the iframe we fall back to the standard PiP mode.

### Can we disable the PiP player on certain pages?

When in enhanced PiP mode, you can use the `close()` method described in the [Web SDK section](https://docs.firework.tv/web/integration-guide/web-sdk) to close the PiP player.

When in standard PiP mode, you can remove the Firework script tag from the pages where you do not want the player to load.

### Why is my website reloading when closing the enhanced PiP player?

The enhanced PiP mode renders the original page in an iframe so the actual player can break through the page boundary. When the user closes the PiP player, we remove the iframe and reload the actual page to where the user was in the iframe. If this user experience is not ideal for your use case, we recommend using the standard PiP mode.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.firework.com/firework-for-developers/web/integration-guide/enhanced-picture-in-picture.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.