From 754bbf7a25a8dda49b5d08ef0d0443bbf5af0e36 Mon Sep 17 00:00:00 2001 From: Craig Jennings Date: Sun, 7 Apr 2024 13:41:34 -0500 Subject: new repository --- devdocs/html/element%2Fportal.html | 73 ++++++++++++++++++++++++++++++++++++++ 1 file changed, 73 insertions(+) create mode 100644 devdocs/html/element%2Fportal.html (limited to 'devdocs/html/element%2Fportal.html') diff --git a/devdocs/html/element%2Fportal.html b/devdocs/html/element%2Fportal.html new file mode 100644 index 00000000..54f1da5c --- /dev/null +++ b/devdocs/html/element%2Fportal.html @@ -0,0 +1,73 @@ +

<portal>: The Portal element

+

Experimental: This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

The <portal> HTML element enables the embedding of another HTML page into the current one for the purposes of allowing smoother navigation into new pages.

A <portal> is similar to an <iframe>. An <iframe> allows a separate browsing context to be embedded. However, the embedded content of a <portal> is more limited than that of an <iframe>. It cannot be interacted with, and therefore is not suitable for embedding widgets into a document. Instead, the <portal> acts as a preview of the content of another page. It can be navigated into therefore allowing for seamless transition to the embedded content.

+
+

Attributes

+
+

This element includes the global attributes.

referrerpolicy

Sets the referrer policy to use when requesting the page at the URL given as the value of the src attribute.

src

The URL of the page to embed.

+
+

Examples

+ +

Basic example

+
+

The following example will embed the contents of https://example.com as a preview.

+

html

+
<portal id="exampleportal" src="https://example.com/"></portal>
+
+
+
+

Accessibility concerns

+
+

The preview displayed by a <portal> is not interactive, therefore does not receive input events or focus. Therefore the embedded contents of the portal are not exposed as elements in the accessibility tree. The portal can be navigated to and activated like a button, the default behavior when clicking on the portal is to activate it.

Portals are given a default label which is the title of the embedded page. If no title is present the visible text in the preview is concatenated to create a label. The aria-label attribute can be used to override this.

Portals used for prerendering only should be hidden with the hidden HTML attribute or the CSS display property with a value of none.

When using animations during portal activation the prefers-reduced-motion media feature should be respected.

+
+

Technical summary

+
Implicit ARIA role button
DOM interface HTMLPortalElement
+

Specifications

+
+ + +
Specification
Portals
# the-portal-element
+

Browser compatibility

+
+ + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariWebView AndroidChrome AndroidFirefox for AndroidOpera AndroidSafari on IOSSamsung Internet
portal8590NoNo73No?85NoNoNoNo
+

+ © 2005–2023 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
+ https://developer.mozilla.org/en-US/docs/Web/HTML/Element/portal +

+
-- cgit v1.2.3