Firefox ukrywa wszystko oprócz obszaru zawartości przeglądarki

Czy istnieje możliwość ukrycia wszystkich ramek i pasków w Firefoksie, takich jak pasek adresu, pasek nawigacji, tytuł okna i zakładki, więc pozostały obszar to tylko obszar zawartości przeglądarki?

Chciałbym zrobić film z napisanej przeze mnie aplikacji internetowej, ale muszę nakręcić go w większej rozdzielczości niż sama aplikacja. Chcę po prostu pokazać aplikację w tle bez wszystkich elementów przeglądarki.

Najlepszą metodą byłoby użycie skrótu klawiaturowego, dzięki czemu mogę ponownie włączyć wszystkie rzeczy.

Najprostszym sposobem jest zainstalowanie odpowiednich dodatków w przeglądarce Firefox.

W przypadku dowolnej z poniższych instalacji zainstaluj odpowiednie dodatki. Firefox może wymagać ponownego uruchomienia, ale często niepotrzebny w przypadku Firefox Quantum. Klawisz skrótu, jeśli jest dostępny, można zmienić w Menedżerze dodatków> Rozszerzenia dla odpowiedniego dodatku.

Firefox ma przeprojektowaną sekcję skrótów klawiaturowych do zarządzania wszystkimi skrótami w jednym miejscu, która jest dostępna od Firefox 66 .

W przypadku przeglądarki Firefox Legacy

Instalator A korzysta z następujących dodatków:

• Ukryj pasek nawigacji, ostatnio testowany 1.41.1 podpisany
• Ukryj pasek kart, ostatnio testowany z podpisem 2.1.0.1
• Ukryj paski przewijania, ostatnio testowane z podpisem 0.2.1

Na przykład użyłem osobnych klawiszy F3i F4do przełączania odpowiednio menu nawigacyjnego i paska kart (poprzez Ukryj pasek nawigacji i Ukryj pasek). Aby ukryć paski, naciśnij kolejno przypisane klawisze. To da Firefoxowi tylko widoczny pasek tytułu lub dekorację okna.

Ograniczenia: Przypisanie tego samego klucza nie działa dobrze z powodu pewnego opóźnienia między nimi. Wynik jest podobny, nawet jeśli oddzielne klawisze zostały naciśnięte jednocześnie. Tak czy inaczej, jeden z pasków nie będzie się chował i grał w chowanego z użytkownikiem.

Działa z Firefoksem 56 i wcześniejszymi wersjami ( przestarzałe ), ale nie jest już dostępny z dodatków do Firefoksa. Testowane łącznie z Firefoksem 41.0 w systemie Linux. Brak zrzutu ekranu.

Dla Firefox Quantum

Instalator B używa następujących dodatków:

• Nowe okno bez paska narzędzi przez tkrkt

Przejdź do strony internetowej na HTTP, HTTPS lub localhost, a następnie użyj skrótu klawiaturowego lub kliknij odpowiednią ikonę na pasku narzędzi lub „Nowe okno bez paska narzędzi” w menu kontekstowym. Strona internetowa zostanie dodatkowo otwarta w nowym oknie z widocznym paskiem tytułu i tylko pionowym paskiem przewijania.

Skrót klawiaturowy: Shift+ Alt+ N(domyślnie w 1.3.0)

Ograniczenie: Ten dodatek w ogóle nie otwiera żadnej strony lokalnego systemu plików (plik: ///) i stron wbudowanych (about: *).

Działa z Firefoksem 42 i nowszymi. Testowane 1.3.0 z Firefox 69.0 w systemie Linux.

Instalator C używa następujących dodatków:

• Wyskakujące okienko autorstwa Ett Chung

Przejdź do strony internetowej, a następnie kliknij odpowiednią ikonę na pasku narzędzi lub „Przenieś bieżącą kartę do wyskakującego okna” lub „Wyskakuj / scal bieżącą stronę” w menu kontekstowym. Strona internetowa zostanie przeniesiona do nowego okna z widocznym paskiem tytułu i pionowym paskiem przewijania. Aby przywrócić nowe okno do normalnej karty, kliknij ponownie „wyskakuj / scal bieżącą stronę” w menu kontekstowym.

Skrót klawiaturowy: Nieprzypisany (domyślnie w 0.0.8)

Ograniczenie: wyskakujące okienko zawsze będzie na wierzchu oryginalnego okna Firefoksa, którego nie można zmienić.

Działa z Firefoksem 53 i nowszymi. Testowane w wersji 0.0.8 z Firefoksem 69.0 w systemie Linux.

W przeglądarce Firefox bez dodatku

Poniżej zamieściłem osobną odpowiedź (kliknij lub przewiń w dół), która działa dla każdej wersji Firefoksa, ale nie jest to najłatwiejszy sposób i nie ma skrótów klawiaturowych.

Natywnym sposobem jest użycie niestandardowego arkusza stylów w przeglądarce Firefox: userChrome.css

Firefox domyślnie nie ładuje pliku userChrome.css w przeglądarce Firefox 69 i nowszych. Aby ponownie włączyć niestandardowy arkusz stylów, otwórz about:configw przeglądarce Firefox i ustaw preferencję toolkit.legacyUserProfileCustomizations.stylesheetsnatrue

Przed zaktualizowaniem tej odpowiedzi Mike G napisał wcześniej odpowiedź uzupełniającą .

Jak to działa

Poniższy blok kodu zawiera treść userChrome.css, która ukryje pasek kart, pasek nawigacji i paski przewijania w przeglądarce Firefox. Upewnij się, że używasz prawidłowych nazw elementów i identyfikatorów .

/*
 * Do not remove the @namespace line -- it's required for correct functioning
 */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* set default namespace to XUL */

/*
 * Hide tab bar, navigation bar and scrollbars
 * !important may be added to force override, but not necessary
 * #content is not necessary to hide scroll bars
 */
#TabsToolbar {visibility: collapse;}
#navigator-toolbox {visibility: collapse;}
browser {margin-right: -14px; margin-bottom: -14px;}

Ograniczenia: brak skrótów klawiaturowych. Żmudne włączanie i wyłączanie na żądanie.

• Aby przywrócić domyślny interfejs, zmień nazwę userChrome.cssna inną, np. userChrome.tmpI uruchom ponownie Firefox, aby zastosować.

• Aby korzystać z innej instancji przeglądarki Firefox z domyślnym interfejsem, użyj osobnego profilu .

Wszystkie profile są przechowywane w folderze profilu , który można zlokalizować w przeglądarce Firefox za pomocą paska menu lub paska narzędzi, a następnie przejdź do Pomoc> Informacje dotyczące rozwiązywania problemów .

Jak skonfigurować i używać

Poniżej przedstawiono ogólne kroki niezależnie od platformy systemowej.

1. Uruchom Menedżera profili w Firefoksie, a następnie utwórz nowy profil o nazwie „paski ukrycia” (dowolna nazwa) i zamknij Menedżera profili.

2. Uruchom menedżera plików i otwórz folder profilu, który został utworzony w kroku 1.

3. W nowym folderze profilu utwórz nowe pliki, w chrome/userChrome.css tym folder nadrzędny, chromejeśli nie istnieje.

4. Skopiuj i wklej zawartość z userChrome.cssod góry do utworzonego pliku w kroku 3.

5. Na koniec zapisz i zamknij plik.

Aby rozpocząć korzystanie, uruchom instancję Firefoksa z nowym profilem.

Poniższa kombinacja zrzutów ekranu pokazuje Firefox Legacy (po lewej) i Firefox Quantum w systemie Linux. Każde z nich przegląda okno w małym rozmiarze, gdy używany jest niestandardowy arkusz stylów.

Działa ze wszystkimi wersjami Firefoksa, z wyjątkiem Firefox 69 i późniejszych wersji domyślnie ignoruje userChrome.css. Testowane z Firefox 10, 20, 50 (Firefox Legacy) i 60, 63, 69 (Firefox Quantum) w systemie Linux i wszystko działało zgodnie z oczekiwaniami.

Bibliografia

• W odpowiedzi udzielonej przez użytkownika user1929 z Forum pomocy Firefox wspominano #TabToolbarnazwę i identyfikator elementu do modyfikacji paska kart.

• Ten niestandardowy plik autorstwa Timvde na GitHub wspomniał o #navigator-toolboxnazwie i identyfikatorze elementu do modyfikacji paska nawigacji.

• Odpowiedź udzielona przez cor-el na Forum pomocy Firefox wspomniała #content browsernazwę i identyfikator elementu do modyfikowania pasków przewijania.

• Przepełnienie CSS w w3schools, aby zrozumieć, overflownie jest konieczne.

• Widoczność CSS Właściwość w3schools do zrozumienia wartości visibility.

• Jakie są konsekwencje używania „! Ważne” w CSS? Przepełnienie stosu, aby zrozumieć, !importantnie jest konieczne.

• Firefox 60 złamał ukryć pasek przewijania css i Ukryj pasek przewijania Firefox 60: FirefoxCSS na reddit.com sugerował, aby usunąć #contenti pozostawić tylko, browseraby poprawnie ukryć pasek przewijania.

• Firefox 69: userChrome.css i userContent.css domyślnie wyłączona na ghacks.net i PSA: użytkownicy v69 Firefox będzie musiał ustawić pref aby umożliwić userChrome.css i userContent.css na reddit.com oboje zauważyli nową preferencję toolkit.legacyUserProfileCustomizations.stylesheetsw about:config.

Notatka odpowiadającego: Ta odpowiedź została napisana dwa lata później , dopiero po tym, jak zasugerowałem użycie dodatków w pierwszej odpowiedzi . Od tego czasu napisano kilka innych odpowiedzi na podstawie userChrome.css zamiast poprawiać tę odpowiedź. Dlatego ta odpowiedź jest teraz wiki społeczności, dzięki czemu każdy z minimalną reputacją może poprawić ten post, aby nadążać za najnowszymi zmianami w Firefox.

Wiem, że jest bardzo późno, ale zrobiłem do tego bookmarklet, nie wymaga żadnych dodatków i żadnych pobrań :)

Zapisz następujący kod JavaScript jako bookmarklet i kliknij go na stronie, którą chcesz wyświetlić w nowym minimalnym oknie:

javascript:void%20function(){window.open(window.location.href,Math.random(),%22menubar=1,resizable=0%22)}();

Kliknij tutaj, aby ułatwić proces! | JSfiddle

Uwaga: Powinno to działać we wszystkich przeglądarkach

Uwielbiam Firefox i Vivaldi. Jedną z najlepszych cech Vivaldi (jestem użytkownikiem gestów myszy) jest to, że ma tak wiele opcji (paski boczne, zakładki, pasek adresu, pasek stanu itp.), Które można regulować i przenosić ...

Jeden skrót mówi „Ukryj interfejs użytkownika”. Wszystko znika ... więc kiedy nie potrzebujesz widzieć tabulatorów / paska addy itp., Po prostu wykonuję ruch myszy i pozostaję ze stroną i oknem.

Magia.

Co więcej, kolor okna pobiera wskazówki ze strony i działa bardzo dobrze - ładnie się komponuje.

Wiem, że jest późno, ale może komuś się spodoba.

Jeśli chcesz ukryć elementy interfejsu przeglądarki Firefox, dopóki nie będą potrzebne, może mój userChrome.cssjest dla Ciebie. (działa na FF 70.0.1)

• Pasek kart jest ukryty, jeśli tylko jedna karta
• Pasek adresu jest ukryty, dopóki nie zostanie ustawiony za pomocą Ctrl-L, F6 i tym podobnych
• Paski przewijania po prawej stronie są usuwane

Aby ukryć pasek kart, musisz użyć przeglądarki Firefox customize(wystarczy kliknąć pasek kart prawym przyciskiem myszy), aby usunąć pasek newtab (+) buttonkart i upewnić się, że używasz systemu Titlebar(tak aby okno min, maks , i przycisków zamykania nie ma na pasku kart). W przeciwnym razie przyciski te utrudniają ukrywanie.

Instrukcje dotyczące tego, gdzie umieścić userChrome.cssplik i jak go aktywować można znaleźć w tym doskonałym poście: /superuser//a/1269912/1107142

Moje krótkie podsumowanie:

• na about:configstronie przełącz toolkit.legacyUserProfileCustomizations.stylesheetsnatrue
• pobierz Profile Directoryze about:supportstrony
• utwórz katalog o nazwie chromew swoimProfile Directory
• umieść userChrome.cssplik w tym chromekatalogu

Mój userChrome.css, skopiuj i wklej do woli:

/* namespace required, do not remove */
@namespace url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

/* hide tabbar if only one tab */
/* note: won't hide unless newtab (+) button is removed from tabbar and */
/* the system title bars are used (use window manager to disable window */
/* titlebar decorations if desired). */
/* use 'customize' from menu and just drag the (+) button off the tabbar */
/* on the bottom options bar make sure titlebar is on */     
/* setting density to compact is also nice */
#tabbrowser-tabs, #tabbrowser-tabs > .tabbrowser-arrowscrollbox {
    min-height: 0 !important;
}
#tabbrowser-tabs tab {
    min-height: var(--tab-min-height)
}
#tabbrowser-tabs tab[first-visible-tab="true"][last-visible-tab="true"] {
    visibility: collapse;
}

/* autohide addressbar */
/* will show address bar when focused with alt-d,ctrl-l,ctrl-k, or f6 */
/* I don't like the mouse hover activation, but follow comments below */
/* if that's something you'd like. */
/* Also,can change nav-bar to navigation-toolbox to autohide all toolbars */
#nav-bar {
    height: 0px !important;
    min-height: 0px !important;
    overflow: hidden !important;
    /* for mouse hover activation would need some height */
    /* disable above height: 0px line and add: */
    /* height: 3px !important; */
}
/* for mouse hover activation need to add: */
/* #nav-bar:hover, */
#nav-bar:focus,
#nav-bar:focus-within,
#nav-bar:active {
    height: auto !important;
}

/* remove right hand scrollbar */
browser {
    margin-right: -15px;
}

Najlepszą znaną mi opcją jest tryb pełnoekranowy, który włącza się F11we wszystkich nowoczesnych przeglądarkach. To jednak ukryje tło pulpitu i inne aplikacje, które mogą nie być tym, czego chcesz. Po prostu wypełni przestrzeń wokół zawartości aplikacji internetowej kolorem białym (lub niezależnie od koloru tła / obrazu w arkuszu stylów aplikacji internetowej).

Możesz uruchomić okno aplikacji z wiersza poleceń

„c: \ Program Files \ Mozilla Firefox” \ firefox.exe -chrome „ http://www.example.com ”

i umieść na rozszerzonym pulpicie z wybranym tłem.

Pytania dotyczące tego, jak to zrobić w Firefox Quantum ( > = 57 ), mogą odpowiedzieć na to pytanie ( Firefox Quantum (> = 57) Jak przełączać wszystkie paski narzędzi (za pomocą skrótu klawiaturowego, takiego jak F11, ale w oknie, a nie na pełnym ekranie) )

F11 / Pełny ekran jest czasem niepraktyczny.
Jeśli chcesz tylko przełączać paski narzędzi w wersjach Firefoksa wcześniejszych niż 57, jest to możliwe dzięki dodatkowi „Dorando keyconfig”:

1. określ skrypt w „Edytorze kluczy” Dorando:

var s = document.getElementById('status-bar');
s.hidden = !s.hidden;
var b = document.getElementById('PersonalToolbar');
b.collapsed = !b.collapsed;
var nb = document.getElementById('nav-bar');
nb.collapsed =!nb.collapsed
var tb = document.getElementById('TabsToolbar');
tb.collapsed =!tb.collapsed

2. zamapuj go na skrót klawiaturowy za pomocą dodatkowego interfejsu Dorando

powinieneś wypróbować nowy parametr polecenia --kioskz nowej przeglądarki Firefox v.71

https://www.mozilla.org/en-US/firefox/71.0a1/releasenotes/

Zauważ, że powyższa odpowiedź z clearkimury, która sugeruje użycie arkusza stylów, wymaga drobnych poprawek w późniejszych wersjach Firefoksa. Rozwiązanie zadziałało, kiedy to zrobiłem. Z tej strony:

Ustaw Firefox, aby szukał userChrome.css podczas uruchamiania (zaktualizowano 24.05.2019)

Aby przyspieszyć uruchamianie dla większości użytkowników, Firefox 69 nie będzie już szukał tego pliku automatycznie. Musisz mu to powiedzieć. Oto jak:

1. Na nowej karcie wpisz lub wklej about: config w pasku adresu i naciśnij klawisz Enter / Return. Kliknij przycisk akceptujący ryzyko.
2. W polu wyszukiwania nad listą wpisz lub wklej userprof i wstrzymaj się podczas filtrowania listy. Jeśli nic nie widzisz na liście, zignoruj ​​resztę tych instrukcji. Możesz teraz zamknąć tę kartę.
3. Kliknij dwukrotnie preferencje toolkit.legacyUserProfileCustomizations.styles, aby zmienić wartość z false na true.

Ta zmiana powinna obowiązywać przy następnym uruchomieniu.