在全屏幕中顯示和瀏覽網站

Question

我想以「全屏」模式顯示我的網站。要做到這一點，我添加到我的網站腳本：https://github.com/sindresorhus/screenfull.js。它允許我以「全屏」模式顯示頁面。

我上傳頁腳以顯示激活全屏模式的按鈕。 它工作得很好。

這裏是我的頁腳：

<li><a href="#" class="fullscreen">Full screen</a><br /></li> 

這裏是我的JS：

if (screenfull.enabled) { 
      // Display the button if the browser is compatible 
    $('.fullscreen').show(); 
} 

$('.fullscreen').toggle(function() { 
    screenfull.request(); 
}, function() { 
    screenfull.exit(); 
}); 

否則，當我點擊鏈接（將用戶重定向到另一頁），「全屏幕「模式被取消。有誰知道如何修理它？

是否可以在「全屏」模式下開發網站並允許用戶在不退出該模式的情況下導航？我正在採取任何資源。

感謝

Answer 1

從我看到這個庫中，你需要把你指引用戶在頁面中的iframe，然後顯示該iframe。您指向的庫有一個示例頁面，其中包含如何以全屏方式加載外部頁面的示例。代碼如下：

var iframe = document.createElement('iframe') 
iframe.setAttribute('id', 'external-iframe'); 
iframe.setAttribute('src', 'http://bbc.com'); 
iframe.setAttribute('frameborder', 'no'); 
iframe.style.position = 'absolute'; 
iframe.style.top = '0'; 
iframe.style.right = '0'; 
iframe.style.bottom = '0'; 
iframe.style.left = '0'; 
iframe.style.width = '100%'; 
iframe.style.height = '100%'; 
$('#container').prepend(iframe); 
document.body.style.overflow = 'hidden'; 

我在http://sindresorhus.com/screenfull.js/拉這個代碼右出的例子。