Есть ли возможность скрыть все границы и панели в Firefox, такие как адресная строка, панель навигации, заголовок окна и вкладки, чтобы оставшаяся область была только областью контента браузера?

Я хотел бы сделать фильм с веб-приложением, которое я написал, но мне нужно снять его в большем разрешении, чем само приложение. Я просто хочу показать приложение на фоне без всей этой браузерной ерунды.

Лучший способ сделать это – через сочетание клавиш, чтобы я мог снова включить все это.

Самый простой способ – установить соответствующие расширения в Firefox.

Для любой из следующих настроек установите соответствующие расширения. Firefox может потребовать перезапуска, но часто это не нужно для Firefox Quantum. Горячую клавишу, если она доступна, можно изменить в Менеджере дополнений > Расширения для соответствующего дополнения.

Firefox имеет переработанный раздел горячих клавиш, чтобы управлять всеми сочетаниями клавиш в одном месте, который доступен с Firefox 66.

Для Firefox Legacy

Настройка A использует следующие расширения:

• Скрытие панели навигации, последняя проверка 1.41.1-signed
• Скрытие панели вкладок, последняя проверка 2.1.0.1-signed
• Скрытие полос прокрутки, последняя проверка 0.2.1-signed

Например, я использовал отдельные клавиши F3 и F4 для переключения меню навигации и панели вкладок (через Скрытие панели навигации и Скрытие панели вкладок) соответственно. Чтобы скрыть панели, нажмите назначенные клавиши одну за другой. Это даст Firefox с видимой панелью заголовка или оконным декором только.

Ограничение: Назначение одной и той же клавиши работает плохо из-за некоторой задержки между нажатиями. Результат будет похожим, даже если отдельные клавиши были нажаты одновременно. В любом случае одна из панелей не скроется и будет играть в прятки с пользователем.

Работает с Firefox 56 и ранее (Устарело), но больше не доступно в дополнениях Firefox. Проверено с Firefox 41.0 на Linux. Скриншот отсутствует.

Для Firefox Quantum

Настройка B использует следующие расширения:

• Новое окно без панели инструментов от tkrkt

Перейдите на веб-страницу по HTTP, HTTPS или localhost, затем используйте сочетание клавиш или нажмите соответствующий значок на панели инструментов или “Новое окно без инструментария” в контекстном меню. Веб-страница откроется в новом окне только с видимой панелью заголовка и вертикальной полосой прокрутки.

Горячая клавиша: Shift+Alt+N (по умолчанию в 1.3.0)

Ограничение: Это расширение не открывает никакие страницы на локальной файловой системе (file:///) и встроенные страницы (about:*) вообще.

Работает с Firefox 42 и выше. Проверено 1.3.0 с Firefox 69.0 на Linux.

Настройка C использует следующие расширения:

• Всплывающее окно от Ett Chung

Перейдите на веб-страницу, затем нажмите соответствующий значок на панели инструментов или “Переместить текущую вкладку в всплывающее окно” или “всплывающее/объединить текущую страницу” в контекстном меню. Веб-страница переместится в новое окно только с видимой панелью заголовка и вертикальной полосой прокрутки. Чтобы вернуть новое окно в обычную вкладку, снова нажмите “всплывающее/объединить текущую страницу” в контекстном меню.

Горячая клавиша: Не назначена (по умолчанию в 0.0.8)

Ограничение: Всплывающее окно всегда будет поверх оригинального окна Firefox, что нельзя изменить.

Работает с Firefox 53 и выше. Проверено 0.0.8 с Firefox 69.0 на Linux.

Для Firefox без дополнений

Я опубликовал отдельный ответ ниже (кликните или прокрутите вниз), который работает для любого выпуска Firefox, но не самый простой способ и не имеет горячих клавиш.

Нативный способ – использовать пользовательский стиль в Firefox: userChrome.css

Firefox не загружает userChrome.css по умолчанию в Firefox 69 и выше. Чтобы сделать пользовательский стиль эффективным снова, откройте about:config в Firefox и установите параметр toolkit.legacyUserProfileCustomizations.stylesheets в true

Перед тем как этот ответ был обновлен, Майк Г. написал последующий ответ ранее.

Как это работает

Следующий блок кода является содержимым userChrome.css, который скроет панель вкладок, панель навигации и полосы прокрутки в Firefox. Убедитесь, что используете правильные имена и ID элементов.

/*
 * Не удаляйте строку @namespace -- она необходима для корректной работы
 */
@namespace url("http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"); /* установить стандартное пространство имен на XUL */

/*
 * Скрыть панель вкладок, панель навигации и полосы прокрутки
 * !important может быть добавлен для принудительного переопределения, но не обязательно
 * #content не обязательно скрывать полосы прокрутки
 */
#TabsToolbar {visibility: collapse;}
#navigator-toolbox {visibility: collapse;}
browser {margin-right: -14px; margin-bottom: -14px;}

Ограничение: Нет горячих клавиш. Утомительно включать или выключать по мере необходимости.

• Чтобы восстановить стандартный интерфейс, переименуйте userChrome.css в другое имя, например userChrome.tmp, и перезапустите Firefox для активации.

• Чтобы использовать рядом с другой инстанцией Firefox с стандартным интерфейсом, используйте отдельный профиль.

Все профили хранятся в папке профиля, которую можно найти из Firefox с помощью меню или панели инструментов, а затем перейти к Справка > Информация об устранении неполадок.

Как настроить и использовать

Следующие шаги являются общими, независимо от платформы.

1. Запустите Менеджер профилей Firefox, затем создайте новый профиль с именем ‘hidebars’ (любое по вашему выбору) и закройте Менеджер профилей.

2. Запустите файловый менеджер и откройте папку профиля, которая была создана на шаге 1.

3. В новой папке профиля создайте новые файлы chrome/userChrome.css, включая родительскую папку chrome, если она не существует.

4. Скопируйте и вставьте содержимое userChrome.css из вышеупомянутого в созданный файл на шаге 3.

5. Наконец, сохраните и закройте файл.

Чтобы начать использовать, запустите инстанцию Firefox с новым профилем.

Следующий скриншот показывает Firefox Legacy (слева) и Firefox Quantum на Linux, каждый в небольшом размере окна при использовании пользовательского стиля.

Работает со всеми выпусками Firefox, кроме Firefox 69 и выше, которые игнорируют userChrome.css по умолчанию. Проверено с Firefox 10, 20, 50 (Firefox Legacy) и 60, 63, 69 (Firefox Quantum) на Linux, и все, похоже, работали как ожидалось.

Ссылки

• Этот ответ пользователя user1929 на Форуме поддержки Firefox упоминает имя элемента #TabToolbar и ID для изменения панели вкладок.

• Этот пользовательский файл от Timvde на GitHub упоминает имя элемента #navigator-toolbox и ID для изменения панели навигации.

• Этот ответ пользователя cor-el на Форуме поддержки Firefox упоминает имя элемента #content browser и ID для изменения полос прокрутки.

• CSS overflow на w3schools для понимания, что overflow не обязательно.

• CSS visibility Property на w3schools для понимания значения visibility.

• Каковы последствия использования “!important” в CSS? на Stack Overflow для понимания, что !important не обязательно.

• Firefox 60 сломал CSS для скрытия полосы прокрутки и Скрыть полосу прокрутки Firefox 60 : FirefoxCSS на reddit.com обе советуют удалить #content и оставить только browser для правильного скрытия полосы прокрутки.

• Firefox 69: userChrome.css и userContent.css отключены по умолчанию на ghacks.net и PSA: пользователи Firefox v69 должны установить предпочтение, чтобы включить userChrome.css и userContent.css на reddit.com отметили новую настройку toolkit.legacyUserProfileCustomizations.stylesheets в about:config.

Примечание отвечающего: Этот ответ был написан через два года, только после того, как я предложил использовать дополнения в первом ответе. С тех пор было написано еще несколько ответов, основанных на userChrome.css, вместо того чтобы улучшать этот ответ. Поэтому этот ответ теперь является вики-сообществом, чтобы любой с минимальной репутацией мог улучшить этот пост, чтобы быть в курсе последних изменений в Firefox.

Я знаю, что это очень поздно, но я сделал закладку для этого, она не требует дополнительных модулей и загрузок 🙂

Сохраните следующий JavaScript код как закладку, и нажмите на нее на странице, которую вы хотите просмотреть в новом минимальном окне:

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

JSFiddle

Примечание: Это должно работать во всех браузерах

Я знаю, что поздно, но возможно, кому-то это понравится.

Если вы просто хотите скрыть элементы интерфейса Firefox, пока они не понадобятся, то, возможно, мой userChrome.css для вас. (работает на FF 70.0.1)

• Вся панель навигации скрыта, пока не будет сфокусирована с помощью Ctrl-L, F6 и подобных клавиш

Чтобы скрыть панель вкладок, вам нужно использовать настройку Firefox customize (просто щелкните правой кнопкой мыши на панели вкладок), чтобы вытащить кнопку newtab (+) с панели вкладок и убедитесь, что вы используете системную 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 url(http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul);

#navigator-toolbox {
    height: 0px !important;
    min-height: 0px !important;
    overflow: hidden !important;
}

#navigator-toolbox:focus,
#navigator-toolbox:focus-within,
#navigator-toolbox:active {
    height: auto !important;
    overflow: visible !important;
}

Я люблю Firefox и Vivaldi. Одна из лучших функций Vivaldi (поскольку я использую жесты мыши) заключается в том, что у него много настроек (боковые панели, закладки, адресная строка, строка состояния и т. д.), которые можно настроить и перемещать…

Одно сочетание клавиш говорит «Скрыть UI». Все исчезает… поэтому, когда вам не нужно видеть вкладки/адресную строку и т. д., я просто делаю движение мышью и остаюсь с самой страницей и окном.

Магия.

Еще лучше, цвет окна берет подсказки из веб-страницы и работает очень хорошо – прекрасно сливается.

вы должны попробовать новую команду параметра --kiosk из нового Firefox v.71

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

Лучшая опция, которую я знаю, – это полноэкранный режим, который переключается с помощью F11 во всех современных браузерах. Это скроет ваш рабочий стол и другие приложения, что может пожалуй, не то, что вам нужно. Он просто заполнит пространство вокруг содержимого веб-приложения белым (или любым там цветом/изображением фона в CSS веб-приложения).

Вы можете запустить окно вашего приложения из командной строки

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

и разместить на расширенном рабочем столе с фоном по вашему выбору.

Обратите внимание, что ответ от clearkimura выше, который предлагает использовать таблицы стилей, требует небольших изменений в более поздних версиях Firefox. Решение сработало для меня, как только я это сделал. С этой веб-страницы:

Настройте Firefox на поиск userChrome.css при запуске (обновлено 24.05.2019)

Чтобы ускорить запуск для большинства пользователей, Firefox 69 больше не будет автоматически искать этот файл. Вам нужно сказать ему искать. Вот как:

1. В новой вкладке введите или вставьте about:config в адресной строке и нажмите Enter/Return. Нажмите кнопку, принимающую риск.
2. В строке поиска над списком введите или вставьте userprof и остановитесь, пока список фильтруется. Если вы ничего не видите в списке, пожалуйста, игнорируйте остальную часть этих инструкций. Вы можете закрыть эту вкладку сейчас.
3. Дважды щелкните параметр toolkit.legacyUserProfileCustomizations.stylesheets, чтобы переключить значение с false на true.

Это изменение должно вступить в силу при следующем запуске.

Вопросы о том, как это сделать в 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

Вот способ удалить список вкладок и панель навигации Firefox только в полноэкранном режиме, аналогично поведению Chrome. Он в значительной степени заимствует из других отличных ответов здесь и был протестирован на Firefox v112 и macOS Ventura.

1. Откройте about:config и установите toolkit.legacyUserProfileCustomizations.stylesheets на true.
2. Создайте chrome/userChrome.css в вашей папке профиля Fireox.
3. Вставьте следующий фрагмент CSS в этот файл, а затем перезапустите Firefox:

@-moz-document url(chrome://browser/content/browser.xul),
               url(chrome://browser/content/browser.xhtml) {
  :root[inFullscreen] #TabsToolbar,
  :root[inFullscreen] #navigator-toolbox {
    visibility: collapse;
  }
}

Некоторые заметки:

• Вы не нуждаетесь в строке @namespace в принятом ответе.
• Вам не нужна строка browser {margin-right: -14px; margin-bottom: -14px;}. На самом деле, я обнаружил, что эта строка ничего не делает, кроме как мешает отображению инструментов разработчиков.
• Лично я буду использовать небольшую модификацию предложенного здесь решения, чтобы всегда скрывать вкладки в пользу плагина Tree Style Tab.