Firefox nasconde tutto tranne l'area dei contenuti del browser

Esiste la possibilità di nascondere tutti i bordi e le barre in Firefox come la barra degli indirizzi, la barra di navigazione, il titolo della finestra e le schede, quindi l'area rimanente è solo l'area del contenuto del browser?

Vorrei fare un film su un'applicazione Web che ho scritto, ma devo filmarlo con una risoluzione maggiore rispetto all'app stessa. Voglio semplicemente mostrare l'app su uno sfondo senza tutte le cose del browser.

Il metodo migliore sarebbe tramite la scorciatoia da tastiera, in modo da poter riattivare nuovamente tutto il materiale.

Il modo più semplice è installare componenti aggiuntivi pertinenti in Firefox.

Per una delle seguenti impostazioni, installa i rispettivi componenti aggiuntivi. Potrebbe essere necessario riavviare Firefox, ma spesso non è necessario per Firefox Quantum. Il tasto di scelta rapida, se disponibile, può essere modificato da Gestione componenti aggiuntivi> Estensioni per il rispettivo componente aggiuntivo.

Firefox ha una sezione di scorciatoie da tastiera riprogettata per gestire tutte le scorciatoie in un unico posto, che è stata resa disponibile da Firefox 66 .

Per Firefox Legacy

L'installazione A utilizza i seguenti componenti aggiuntivi:

• Nascondi la barra di navigazione, ultima prova 1.41.1 firmata
• Nascondi Tabbar, ultimo test firmato 2.1.0.1
• HideScrollbars, ultimo test firmato 0.2.1

Ad esempio, ho usato tasti separati F3e F4per attivare o disattivare il menu di navigazione e la barra delle schede (tramite Nascondi barra di navigazione e Nascondi scheda). Per nascondere le barre, premere i tasti assegnati uno per uno. Ciò consentirà a Firefox di visualizzare solo la barra del titolo o la decorazione della finestra.

Limitazione: l'assegnazione della stessa chiave non funziona bene, a causa di alcuni ritardi nel mezzo. Il risultato è simile anche se i tasti separati sono stati premuti contemporaneamente. In entrambi i casi, una delle barre non si nasconderà e giocherà a nascondino con l'utente.

Funziona con Firefox 56 e precedenti ( obsoleto ), ma non è più disponibile dai componenti aggiuntivi di Firefox. Testato completamente con Firefox 41.0 su Linux. Nessuno screenshot.

Per Firefox Quantum

Il programma di installazione B utilizza i seguenti componenti aggiuntivi:

• Nuova finestra senza barra degli strumenti di tkrkt

Vai a una pagina Web su HTTP, HTTPS o localhost, quindi utilizza la scorciatoia da tastiera o fai clic sull'icona corrispondente sulla barra degli strumenti o "Nuova finestra senza barra degli strumenti" nel menu di scelta rapida. La pagina Web si aprirà inoltre in una nuova finestra con solo la barra del titolo visibile e la barra di scorrimento verticale.

Scorciatoia da tastiera: Shift+ Alt+ N(impostazione predefinita in 1.3.0)

Limitazione: questo componente aggiuntivo non apre alcuna pagina sul filesystem locale (file: ///) e le pagine integrate (circa: *).

Funziona con Firefox 42 e versioni successive. Testato 1.3.0 con Firefox 69.0 su Linux.

Il programma di installazione C utilizza i seguenti componenti aggiuntivi:

• Finestra a comparsa di Ett Chung

Vai a una pagina web, quindi fai clic sull'icona corrispondente sulla barra degli strumenti o "Sposta la scheda corrente nella finestra a comparsa" o "popup / unisci la pagina corrente" nel menu di scelta rapida. La pagina Web si sposterà in una nuova finestra con solo la barra del titolo visibile e la barra di scorrimento verticale. Per ripristinare la nuova finestra in una scheda normale, fai di nuovo clic su "popup / unisci pagina corrente" nel menu contestuale.

Tasto di scelta rapida: non assegnato (impostazione predefinita in 0.0.8)

Limitazione: la finestra pop-up rimarrà sempre in cima alla finestra originale di Firefox, che non può essere modificata.

Funziona con Firefox 53 e versioni successive. Testato 0.0.8 con Firefox 69.0 su Linux.

Per Firefox senza componente aggiuntivo

Ho pubblicato una risposta separata in basso (fare clic o scorrere verso il basso) che funziona per qualsiasi versione di Firefox, ma non è il modo più semplice e non ha scorciatoie da tastiera.

Il modo nativo è utilizzare il foglio di stile personalizzato in Firefox: userChrome.css

Firefox non carica userChrome.css per impostazione predefinita in Firefox 69 e versioni successive. Per rendere nuovamente efficace il foglio di stile personalizzato, apri about:configin Firefox e imposta la preferenza toolkit.legacyUserProfileCustomizations.stylesheetssutrue

Prima che questa risposta fosse aggiornata, Mike G ha scritto una risposta di follow-up in precedenza .

Come funziona

Il seguente blocco di codice è il contenuto userChrome.cssche nasconderà la barra delle schede, la barra di navigazione e le barre di scorrimento in Firefox. Assicurarsi di utilizzare nomi e ID validi degli elementi .

/*
 * 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;}

Limitazione: nessuna scorciatoia da tastiera. Tedioso da abilitare o disabilitare su richiesta.

• Per ripristinare l'interfaccia predefinita, rinominare userChrome.csscome un altro nome userChrome.tmpe riavviare Firefox per rendere effettive.

• Per utilizzare fianco a fianco con un'altra istanza di Firefox con interfaccia predefinita, utilizzare un profilo separato .

Tutti i profili sono memorizzati nella cartella dei profili , che può essere trovata da Firefox utilizzando la barra dei menu o la barra degli strumenti, quindi vai su Aiuto> Informazioni sulla risoluzione dei problemi .

Come installare e utilizzare

Di seguito sono riportati i passaggi generici indipendentemente dalla piattaforma di sistema.

1. Esegui Profile Manager di Firefox, quindi crea un nuovo profilo chiamato 'hidebars' (qualsiasi nome di scelta) e chiudi Profile Manager.

2. Eseguire un file manager e aprire la cartella del profilo creata nel passaggio 1.

3. Sotto la nuova cartella del profilo, creare nuovi file chrome/userChrome.css inclusa la cartella principale chromese non esiste.

4. Copia e incolla il contenuto di userChrome.cssdall'alto nel file creato nel passaggio 3.

5. Infine, salva e chiudi il file.

Per iniziare a utilizzare, esegui un'istanza di Firefox con il nuovo profilo.

La seguente combinazione di schermate mostra Firefox Legacy (a sinistra) e Firefox Quantum su Linux, ognuno dei quali sfoglia in piccole finestre quando viene utilizzato il foglio di stile personalizzato.

Funziona con tutte le versioni di Firefox, tranne Firefox 69 e versioni successive che ignorano userChrome.css per impostazione predefinita. Testato con Firefox 10, 20, 50 (Firefox Legacy) e 60, 63, 69 (Firefox Quantum) su Linux e tutto sembrava funzionare come previsto.

Riferimenti

• Questa risposta di user1929 sul forum di supporto di Firefox menzionava il #TabToolbarnome dell'elemento e l'ID per la modifica della barra delle schede.

• Questo file personalizzato di Timvde su GitHub menzionava il #navigator-toolboxnome dell'elemento e l'ID per modificare la barra di navigazione.

• Questa risposta di cor-el sul forum di supporto di Firefox menzionava il #content browsernome dell'elemento e l'ID per la modifica delle barre di scorrimento.

• L'overflow CSS su w3schools per capire overflownon è necessario.

• Visibilità CSS Proprietà su w3schools per capire il valore per visibility.

• Quali sono le implicazioni dell'utilizzo di “! Important” nei CSS? su Stack Overflow per capire !importantnon è necessario.

• Firefox 60 ha rotto hidebar scroll css e Hide Scrollbar Firefox 60: FirefoxCSS su reddit.com ha entrambi suggerito di rimuovere #contente lasciare solo browserper nascondere correttamente la barra di scorrimento.

• Firefox 69: userChrome.css e userContent.css disabilitati per impostazione predefinita su ghacks.net e PSA: gli utenti di Firefox v69 dovranno impostare un pref per abilitare userChrome.css e userContent.css su reddit.com entrambi hanno notato una nuova preferenza toolkit.legacyUserProfileCustomizations.stylesheetsin about:config.

Nota del rispondente: questa risposta è stata scritta due anni dopo , solo dopo che avevo suggerito di utilizzare i componenti aggiuntivi nella prima risposta . Da allora, sono state scritte diverse altre risposte basate su userChrome.css invece di migliorare questa risposta. Quindi questa risposta è ora un wiki della comunità, in modo che chiunque abbia una reputazione minima possa migliorare questo post per tenere il passo con le ultime modifiche in Firefox.

So che è super in ritardo, ma ho creato un bookmarklet per questo, non richiede componenti aggiuntivi né download :)

Salvare il seguente codice JavaScript come bookmarklet e fare clic su di esso nella pagina che si desidera visualizzare in una nuova finestra minima:

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

Fai clic qui per semplificare il processo! | JSfiddle

Nota: questo dovrebbe funzionare in tutti i browser

Adoro Firefox e Vivaldi. Una delle migliori caratteristiche di Vivaldi (che sono un utente dei gesti del mouse) è che ha così tante opzioni (barre laterali, segnalibri, barra degli indirizzi, barra di stato ecc.) Che possono essere regolate e spostate ...

Una scorciatoia dice "Nascondi UI". Tutto scompare ... quindi quando non hai bisogno di vedere tab / addy bar ecc., Allora faccio solo uno squiggle con il mouse e mi rimane la pagina e la finestra.

Magia.

Ancora meglio, il colore della finestra prende suggerimenti dalla pagina web e funziona molto bene - si integra perfettamente.

So che è tardi, ma forse a qualcuno piacerà.

Se vuoi solo nascondere gli elementi dell'interfaccia utente di Firefox fino a quando non sono necessari, forse il mio userChrome.cssè per te. (lavorando su FF 70.0.1)

• La barra delle schede è nascosta se una sola scheda
• La barra degli indirizzi è nascosta fino a quando non viene focalizzata con Ctrl-L, F6 e simili
• Le barre di scorrimento a destra vengono rimosse

Per nascondere la barra delle schede devi usare Firefox customize(basta fare clic con il tasto destro sulla barra delle schede) per estrarre la newtab (+) buttonbarra delle schede e assicurarti di utilizzare il sistema Titlebar(in modo che la finestra min, max e i pulsanti di chiusura non sono presenti nella barra delle schede). Altrimenti, quei pulsanti ostacoleranno il nascondiglio.

Le istruzioni su dove posizionare il userChrome.cssfile e su come attivarlo sono disponibili in questo eccellente post: /superuser//a/1269912/1107142

Il mio breve riassunto:

• a about:configpagina ginocchiera toolkit.legacyUserProfileCustomizations.stylesheetspertrue
• ottenere Profile Directorydalla about:supportpagina
• crea una directory chiamata chromenel tuoProfile Directory
• metti il userChrome.cssfile in quella chromedirectory

Il mio userChrome.css, copia e incolla a piacimento:

/* 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;
}

L'opzione migliore che conosco è la modalità a schermo intero, che viene attivata utilizzando F11tutti i browser moderni. Ciò nasconderà lo sfondo del desktop e altre app, che potrebbero non essere ciò che desideri. Riempirà semplicemente lo spazio attorno al contenuto dell'applicazione Web con il bianco (o qualunque sia il colore / l'immagine di sfondo nel foglio di stile dell'app Web).

Puoi eseguire la finestra dell'app dalla riga di comando

"c: \ Programmi \ Mozilla Firefox" \ firefox.exe -chrome " http://www.example.com "

e posizionalo su un desktop esteso con uno sfondo a tua scelta.

Le domande su come eseguire questa operazione in Firefox Quantum ( > = 57 ) possono forse rispondere a questa domanda ( Firefox Quantum (> = 57) Come attivare / disattivare tutte le barre degli strumenti? (Con una scorciatoia da tastiera, come F11 ma in una finestra, non a schermo intero) )

F11 / A schermo intero a volte è poco pratico.
Se vuoi solo attivare / disattivare le barre degli strumenti nelle versioni di Firefox precedenti alla 57 , è possibile con l'addon "Dorando keyconfig":

1. specificare uno script nel "Key Editor" di 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. associarlo a una scorciatoia da tastiera tramite l'interfaccia addon Dorando

dovresti provare nuovi parametri di comando --kioskdal nuovo Firefox v.71

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

Nota che la risposta di clearkimura di cui sopra, che suggerisce l'uso di un foglio di stile, necessita di qualche modifica nelle versioni successive di Firefox. La soluzione ha funzionato per me una volta che ho fatto questo. Da questo pagina Web:

Imposta Firefox per cercare userChrome.css all'avvio (aggiornato il 24/05/2019)

Per rendere l'avvio più veloce per la maggior parte degli utenti, Firefox 69 non cercherà più questo file automaticamente. Devi dirlo per guardare. Ecco come:

1. In una nuova scheda, digitare o incollare about: config nella barra degli indirizzi e premere Invio / A capo. Fare clic sul pulsante che accetta il rischio.
2. Nella casella di ricerca sopra l'elenco, digitare o incollare userprof e mettere in pausa mentre l'elenco viene filtrato.Se non vedi nulla nell'elenco, ignora il resto di queste istruzioni. Puoi chiudere questa scheda ora.
3. Fare doppio clic sui fogli toolkit.legacyUserProfileCustomizations.styles preferenza per cambiare il valore da false a true.

Tale modifica dovrebbe avere effetto al prossimo avvio.