Firefoxはブラウザのコンテンツ領域を除くすべてを隠します

28

アドレスバー、ナビゲーションバー、ウィンドウタイトル、タブなどのFirefoxのすべての境界線とバーを非表示にする可能性があるので、残りの領域はブラウザのコンテンツ領域にすぎませんか？

作成したWebアプリケーションのムービーを作成したいのですが、アプリケーション自体よりも大きな解像度で撮影する必要があります。私は、ブラウザのすべてのものを使わずに、背景にアプリを表示したいだけです。

最善の方法は、キーボードショートカットを使用することです。これにより、すべてのものを再び有効にできます。

firefox  addons 
— ウロコ
ソース
1
F11を押すだけでは不十分ですか？
— イヴァンネレチン
2
F11を押すと、他のウィンドウが非表示になります。これは、ウィンドウマネージャのタイリングで特に問題になります。
— -gmarmstrong
OBSは、トリミングによってfirefoxを改造することなくこれを解決できます。
— ジョナサン

回答:

21

最も簡単な方法は、Firefoxに関連するアドオンをインストールすることです。

次のセットアップのいずれかで、それぞれのアドオンをインストールします。Firefoxの再起動が必要になる場合がありますが、Firefox Quantumには多くの場合不要です。ショートカットキーがある場合は、各アドオンの[アドオンマネージャー]> [拡張機能]から変更できます。

Firefoxには、すべてのショートカットを1か所で管理するためのキーボードショートカットセクションが再設計されており、Firefox 66以降で利用可能になりました。

Firefox Legacyの場合

セットアップAは、次のアドオンを使用します。

  • ナビゲーションバーを非表示、最後にテスト済み1.41.1署名済み
  • 非表示Tabbar、最後にテストされた2.1.0.1署名済み
  • HideScrollbars、最後にテストされた0.2.1署名済み

たとえば、個別のキーF3を使用してF4、ナビゲーションメニューとタブバーを切り替えます（ナビゲーションバーを非表示にするとタブバーを非表示にする）。バーを非表示にするには、割り当てられたキーを1つずつ押します。これにより、Firefoxに表示されるタイトルバーまたはウィンドウ装飾のみが表示されます。

制限：同じキーを割り当てることは、間に遅延があるためうまく機能しません。別々のキーが同時に押された場合でも、結果は同様です。いずれにしても、バーの1つは非表示にならず、ユーザーとのかくれんぼもしません。

Firefox 56以前（非推奨）で動作しますが、Firefoxアドオンからは使用できなくなりました。Linux上のFirefox 41.0で完全にテストされました。スクリーンショットなし。

Firefox Quantumの場合

セットアップBは、次のアドオンを使用します。

HTTP、HTTPS、またはlocalhostのWebページに移動し、キーボードショートカットを使用するか、ツールバーの対応するアイコンまたはコンテキストメニューの[ツールバーのない新しいウィンドウ]をクリックします。Webページは、表示されるタイトルバーと垂直スクロールバーのみを持つ新しいウィンドウでさらに開きます。

キーボードショートカット：Shift+ Alt+ N（1.3.0のデフォルト）

制限：このアドオンは、ローカルファイルシステム（file：///）および組み込みページ（about：*）のページをまったく開きません。

Firefox 42以降で動作します。Linux上のFirefox 69.0で1.3.0をテストしました。

tkrktによるツールバーのない新しいウィンドウ

セットアップCは、次のアドオンを使用します。

Webページに移動し、ツールバーの対応するアイコンをクリックするか、コンテキストメニューで[現在のタブをポップアップウィンドウに移動する]または[現在のページをポップアップ/マージする]をクリックします。Webページは、表示されるタイトルバーと垂直スクロールバーのみを持つ新しいウィンドウに移動します。新しいウィンドウを通常のタブに戻すには、コンテキストメニューの[現在のページをポップアップ/マージ]をもう一度クリックします。

キーボードショートカット：割り当てられていません（デフォルトは0.0.8）

制限：ポップアップウィンドウは常に、Firefoxの元のウィンドウの一番上にありますが、変更することはできません。

Firefox 53以降で動作します。Linux上のFirefox 69.0で0.0.8をテストしました。

Ett Chungのポップアップウィンドウ

アドオンなしのFirefoxの場合

Firefoxのどのリリースでも機能する別の回答（クリックまたはスクロールダウン）を以下に投稿しましたが、最も簡単な方法ではなく、キーボードショートカットもありません。

— ユーザー109256
ソース
2
個別にバーのオン/オフを切り替える代わりに、OPが要求することを行う単一の拡張機能があれば素晴らしいでしょう。拡張機能がすべてのバーを非表示にしたときに表示されていたものを元に戻すことで切り替えます。
— ミッチェルモデル
2
注：タブのソリューションは、最新のFirefoxバージョンでは機能しなくなりました。ここでタブターゲットQAを作成しました：superuser.com/questions/1268732/…–
— VasyaNovikov
13

ネイティブの方法は、Firefoxでカスタムスタイルシートを使用することです。 userChrome.css

Firefoxは、Firefox 69以降ではデフォルトでuserChrome.cssをロードしません。カスタムスタイルシートを再び有効にするにはabout:config、Firefox で開き、設定toolkit.legacyUserProfileCustomizations.stylesheetsをtrue

この回答が更新される前に、マイクGは以前にフォローアップの回答を書きました。

使い方

次のコードブロックは、userChrome.cssFirefoxのタブバー、ナビゲーションバー、スクロールバーを非表示にするコンテンツです。有効な要素名とIDを使用してください。

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

制限：キーボードショートカットはありません。オンデマンドを有効または無効にするのは面倒です。

  • デフォルトのインターフェースを復元するには、userChrome.css他の名前に名前を変更し、userChrome.tmpFirefoxを再起動して有効にします。

  • デフォルトのインターフェースでFirefoxの別のインスタンスと並べて使用するには、別のプロファイルを使用します。

すべてのプロファイルはプロファイルフォルダーに保存されます。このフォルダーは、メニューバーまたはツールバーを使用してFirefoxから見つけることができ、[ヘルプ]> [トラブルシューティング情報]に移動します。

セットアップと使用方法

以下は、システムプラットフォームに関係なく一般的な手順です。

  1. Firefoxのプロファイルマネージャーを実行し、「hidebars」（任意の名前）という名前の新しいプロファイルを作成して、プロファイルマネージャーを閉じます。

  2. ファイルマネージャーを実行し、手順1で作成したプロファイルフォルダーを開きます。

  3. 新しいプロファイルフォルダーの下に、親フォルダーが存在しない場合は、そのフォルダーを含む新しいファイル chrome/userChrome.cssを作成しますchrome。

  4. userChrome.css上記のコンテンツをコピーして、手順3で作成したファイルに貼り付けます。

  5. 最後に、ファイルを保存して閉じます。

使用を開始するには、新しいプロファイルでFirefoxのインスタンスを実行します。

次のスクリーンショットのコンボは、Linux上のFirefox Legacy（左）とFirefox Quantumを示しています。それぞれカスタムスタイルシートを使用すると、小さなウィンドウサイズでブラウジングします。

Firefox LegacyおよびFirefox Quantum、バーなし

Firefox 69以降を除くすべてのリリースのFirefoxで動作し、デフォルトでuserChrome.cssを無視します。LinuxでFirefox 10、20、50（Firefox Legacy）および60、63、69（Firefox Quantum）でテストしたところ、すべて正常に動作するようでした。

参照資料

回答者のメモ：この回答は2年後、最初の回答でアドオンの使用を提案した後にのみ書かれました。それ以降、userChrome.cssに基づいて、この回答を改善する代わりに、さらにいくつかの回答が作成されました。したがって、この回答はコミュニティWikiになったため、評判の低い人なら誰でもこの投稿を改善して、Firefoxの最新の変更についていくことができます。

— ユーザー109256
ソース
1
あなたはプロファイルフォルダが~/.mozilla/firefox/Linux上にあることを言及したいかもしれません
— -hansaplast
1
更新された回答。クロスプラットフォームの方法が推奨されます。これは、Firefox自体から見つけることです。[ヘルプ]> [トラブルシューティング情報]の[アプリケーションの基本]で、[ディレクトリを開く]をクリックします。
8

私はこれが非常に遅いことを知っていますが、このためのブックマークレットを作成しました。アドオンやダウンロードは不要です:)

次のJavaScriptコードをブックマークレットとして保存し、新しい最小ウィンドウで表示するページでクリックします。

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

プロセスを簡単にするためにここをクリックしてください！ | JSfiddle

注：これはすべてのブラウザーで動作するはずです

— ラウルドットテック
ソース
1
これは私見では最高の解決策であり、実際の新しい「ウィンドウ」です。トレードオフは、URLバーがまだそこにあるということですが、それは私にとって十分です。ありがとうございました。
— sirfz
@sirfz助けてくれてうれしい:)
— rahuldottech
3

私はFirefoxとVivaldiが大好きです。Vivaldi（私はマウスジェスチャのユーザー）の最も優れた機能の1つは、調整と移動が可能な非常に多くのオプション（サイドバー、ブックマーク、アドレスバー、ステータスバーなど）があることです...

1つのショートカットには「UIを隠す」と表示されます。すべてが消えます...したがって、タブ/追加バーなどを表示する必要がない場合は、マウスを波打つだけでページとウィンドウが残ります。

マジック。

さらに良いことに、ウィンドウの色はWebページからヒントを得て、非常にうまく機能します-うまく調和します。

— ベン
ソース
2
スーパーユーザーへようこそ。問題はFirefoxでこれを行う方法でした。したがって、別のブラウザーで機能を説明することは、実際には質問に対する答えではありません。もう少し担当者がいれば、そのような役立つ情報をコメントとして追加できます。
— fixer1234
しかし、Vivaldiでのうなり声は大きいですが、正しい考えです！（最速のリグでさえ、ブラウザーでそれほど多くのサイクルを無駄にしたくない場合があります）Vivaldiは、FFでこれを探すように私を刺激しました。
— ベンジャミンR
3

遅れていることは知っていますが、誰かが好きになるかもしれません。

Firefox UI要素を必要になるまで非表示にしたいだけなら、多分私userChrome.cssがあなたのためです。（FF 70.0.1で作業中）

  • タブが1つだけの場合、タブバーは非表示になります
  • Ctrl-L、F6などでフォーカスされるまでアドレスバーは非表示
  • 右側のスクロールバーが削除されます

タブバーを非表示にするには、Firefoxを使用してcustomize（タブバーを右クリックするだけで）タブバーを引き出しnewtab (+) buttonて、システムのTitlebar（ウィンドウが最小、最大、閉じるボタンはタブバーにありません）。そうでない場合、これらのボタンは非表示を妨げます。

userChrome.cssファイルを配置する場所とアクティブにする方法についての説明は、次のすばらしい投稿にあります：https : //superuser.com/a/1269912/1107142

私の簡単な要約：

  • 上のabout:configトグルページtoolkit.legacyUserProfileCustomizations.stylesheetsへtrue
  • ページProfile Directoryから取得about:support
  • というディレクトリを作成chromeしますProfile Directory
  • userChrome.cssそのchromeディレクトリにファイルを置く

私のuserChrome.css、コピー＆ペースト自由自在：

/* 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;
}
— リゲロウビー
ソース
1

私が知っている最良のオプションは全画面モードです。これはF11、すべての最新のブラウザーで切り替えられます。ただし、デスクトップの背景やその他のアプリは非表示になります。Webアプリケーションのコンテンツの周りのスペースを白（またはWebアプリのスタイルシートの背景色/画像は何でも）で塗りつぶします。

— CBHacking
ソース
フルスクリーンモードでは、流動的なコンテナに基づいているため、アプリが画面全体に表示されます。ブラウザですべてをオフにし、320x680pxのようにそのままのサイズのままにしておくと、デスクトップの背景が透けて見えるようになります。
— ウロコ
1

コマンドラインからアプリウィンドウを実行できます。

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

選択した背景を持つ拡張デスクトップに配置します。

— アントニー
ソース
これは良い答えだと思います。Gnu / Linuxディストリビューションでは、そのほとんどをスキップして次の操作を実行できますfirefox -chrome。ただし、これはタブバーを非表示にしませんでした。
— -adantj
0

Firefox Quantum（> = 57）でこれを行う方法に関する質問は、おそらくこの質問に答えます（Firefox Quantum（> = 57）すべてのツールバーを切り替える方法（F11のようなキーボードショートカットで、フルスクリーンではなくウィンドウ内））

F11 /フルスクリーンは時々非実用的です。
Firefoxの57より前のバージョンでツールバーを切り替えたい場合は、アドオン「Dorando keyconfig」で可能です。1. 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. Dorandoアドオンインターフェースを介してキーボードショートカットにマッピングします

— エリ
ソース
1
Mashから：Dorando "Key Editor" v2017.3は、最近のFF 57/58では機能しなくなりました。GitHubからの引用：このアドオンは、Firefox 57以降サポートされなくなった古いアドオンAPIを使用しているため、Firefox 57以降と互換性がないことに注意してください。
— fixer1234
1
あなたのコメントに感謝は、多分私は声明を強調している必要があります「あなただけのFirefoxのバージョンでツールバーを切り替えたい場合は、前の Dorando keyconfig 『』それを明確にする57のそれはアドオンで可能である」
— イーライ
0

上記のclearkimuraからの回答は、スタイルシートの使用を示唆していますが、Firefoxの以降のバージョンでは少し調整する必要があります。私がこれをやった後、解決策は私のために働いた。この Webページ：

Firefoxを起動時にuserChrome.cssを検索するように設定します（2019年5月24日更新）

ほとんどのユーザーの起動を高速化するために、Firefox 69はこのファイルを自動的に検索しなくなりました。見るように指示する必要があります。方法は次のとおりです。

  1. 新しいタブで、アドレスバーにabout：configと入力または貼り付けて、Enter / Returnを押します。リスクを受け入れるボタンをクリックします。
  2. リストの上の検索ボックスに、userprofと入力または貼り付けて、リストがフィルターされるまで一時停止します。リストに何も表示されない場合は、これらの指示の残りを無視してください。このタブを閉じることができます。
  3. toolkit.legacyUserProfileCustomizations.stylesheets設定をダブルクリックして、値をfalseからtrueに切り替えます。

この変更は、次回の起動時に有効になります。

— マイク・G
ソース
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.