Slide 1
Slide 1 text
No content
Slide 2
Slide 2 text
No content
Slide 3
Slide 3 text
No content
Slide 4
Slide 4 text
No content
Slide 5
Slide 5 text
No content
Slide 6
Slide 6 text
No content
Slide 7
Slide 7 text
No content
Slide 8
Slide 8 text
No content
Slide 9
Slide 9 text
No content
Slide 10
Slide 10 text
No content
Slide 11
Slide 11 text
No content
Slide 12
Slide 12 text
No content
Slide 13
Slide 13 text
No content
Slide 14
Slide 14 text
const portal = document.querySelector('portal');
portal.activate();
const portal = document.createElement('portal');
portal.src = 'https://example.com’;
document.body.appendChild(portal);
Slide 15
Slide 15 text
const portal = document.querySelector('portal');
portal.activate();
window.addEventListener('portalactivate', event => {
const portal = event.adoptPredecessor();
document.body.appendChild(portal);
//戻るボタンを表示する実装
});
Slide 16
Slide 16 text
if ('HTMLPortalElement' in window) {
// Portalを使った処理
} else {
// Portalを使わない処理
}
if (window.portalHost) {
// Portalとして埋め込まれたときのレイアウトに変更するコード
}
/* iframeをタグ内に記述しておけば、portalタグを認識できないブラウザの場合にfallbackできる */
Slide 17
Slide 17 text
No content
Slide 18
Slide 18 text
No content
Slide 19
Slide 19 text
No content