Wyświetlaj i poruszaj się po witrynie w trybie pełnoekranowym - javascript, jquery, fullscreen

Chciałbym wyświetlić moją stronę internetową w trybie „pełnego ekranu”. Aby to zrobić, dodaję do mojej witryny następujący skrypt: https://github.com/sindresorhus/screenfull.js. Pozwala mi wyświetlać stronę w trybie „pełnego ekranu”.

Przesyłam stopkę, aby wyświetlić przycisk aktywujący tryb pełnoekranowy. Działa świetnie.

oto moja stopka:

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

oto moja Js:

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

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

W przeciwnym razie, kiedy klikam link (przekierowuję użytkownika na inną stronę), tryb „pełnego ekranu” zostaje anulowany. Czy ktoś wie, jak to naprawić?

Czy można stworzyć stronę internetową w trybie „pełnego ekranu” i pozwolić użytkownikowi nawigować bez wychodzenia z tego trybu? Biorę wszelkie zasoby.

Dzięki

Odpowiedzi:

Z tego, co widzę w tej bibliotece, musisz umieścićstrona, na którą kierujesz użytkownika w ramce iframe, a następnie wyświetl tę ramkę iframe. Wskazana biblioteka ma przykładową stronę, która zawiera próbkę załadowania strony zewnętrznej na pełnym ekranie. Kod jest następujący:

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";

Wyciągnąłem ten kod z przykładu pod adresem http://sindresorhus.com/screenfull.js/.