Firefox ẩn mọi thứ trừ khu vực nội dung của trình duyệt

Có khả năng ẩn tất cả các đường viền và thanh trong firefox như thanh địa chỉ, thanh điều hướng, tiêu đề cửa sổ và các tab, vì vậy khu vực còn lại chỉ là khu vực nội dung của trình duyệt?

Tôi muốn làm một bộ phim về một ứng dụng web tôi đã viết, nhưng phải quay nó ở độ phân giải lớn hơn chính ứng dụng đó. Tôi chỉ đơn giản muốn hiển thị ứng dụng trên nền mà không cần tất cả các công cụ trình duyệt.

Phương pháp tốt nhất sẽ là thông qua phím tắt, để tôi có thể lấy lại tất cả mọi thứ một lần nữa.

Cách dễ nhất là cài đặt các tiện ích bổ sung có liên quan trong Firefox.

Đối với bất kỳ thiết lập nào sau đây, hãy cài đặt các tiện ích bổ sung tương ứng. Firefox có thể cần phải khởi động lại, nhưng thường không cần thiết cho Firefox Quantum. Phím tắt, nếu có, có thể được thay đổi từ Trình quản lý tiện ích bổ sung> Tiện ích mở rộng cho tiện ích bổ sung tương ứng.

Firefox có phần phím tắt được thiết kế lại để quản lý tất cả các phím tắt ở một nơi, được cung cấp từ Firefox 66 .

Dành cho Firefox Di sản

Thiết lập A sử dụng các tiện ích bổ sung sau:

• Ẩn thanh điều hướng, đã kiểm tra lần cuối 1.41.1
• Ẩn Tabbar, đã kiểm tra lần cuối 2.1.0.1
• HideScrollbars, được kiểm tra lần cuối 0.2.1

Ví dụ, tôi đã sử dụng các khóa riêng biệt F3 và F4để chuyển đổi menu điều hướng và thanh tab (thông qua Hide Navigation Bar và Hide Tabbar). Để ẩn các thanh, nhấn từng phím được gán. Điều này sẽ cung cấp cho Firefox với thanh tiêu đề hiển thị hoặc trang trí cửa sổ.

Giới hạn: Việc gán cùng một khóa không hoạt động tốt, do một số độ trễ ở giữa. Kết quả là tương tự ngay cả khi các phím riêng biệt được nhấn cùng lúc. Dù bằng cách nào, một trong những quán bar sẽ không ẩn và chơi trò trốn tìm với người dùng.

Hoạt động với Firefox 56 trở về trước ( Không dùng nữa ), nhưng không còn có sẵn từ Tiện ích Firefox. Đã thử nghiệm hoàn toàn với Firefox 41.0 trên Linux. Không có ảnh chụp màn hình.

Đối với lượng tử Firefox

Thiết lập B sử dụng các tiện ích bổ sung sau:

• Cửa sổ mới không có thanh công cụ của tkrkt

Truy cập trang web trên HTTP, HTTPS hoặc localhost, sau đó sử dụng phím tắt hoặc nhấp vào biểu tượng tương ứng trên thanh công cụ hoặc "Cửa sổ mới không có thanh công cụ" trong menu ngữ cảnh. Ngoài ra, trang web sẽ mở trong một cửa sổ mới với thanh tiêu đề hiển thị và thanh cuộn dọc.

Phím tắt: Shift+ Alt+ N(mặc định trong 1.3.0)

Giới hạn: Tiện ích bổ sung này không mở bất kỳ trang nào trên hệ thống tệp cục bộ (tệp: ///) và các trang tích hợp (about: *).

Hoạt động với Firefox 42 trở lên. Đã thử nghiệm 1.3.0 với Firefox 69.0 trên Linux.

Thiết lập C sử dụng các tiện ích bổ sung sau:

• Cửa sổ bật lên của Ett Chung

Chuyển đến một trang web, sau đó nhấp vào biểu tượng tương ứng trên thanh công cụ hoặc "Di chuyển tab hiện tại sang cửa sổ bật lên" hoặc "cửa sổ bật lên / hợp nhất hiện tại" trong menu ngữ cảnh. Trang web sẽ chuyển sang một cửa sổ mới với thanh tiêu đề hiển thị và chỉ thanh cuộn dọc. Để hoàn nguyên cửa sổ mới về tab bình thường, nhấp lại vào "cửa sổ bật lên / hợp nhất hiện tại" trong menu ngữ cảnh.

Phím tắt: Không được chỉ định (mặc định trong 0.0.8)

Giới hạn: Cửa sổ bật lên sẽ luôn ở trên cùng của cửa sổ ban đầu của Firefox, không thể thay đổi.

Hoạt động với Firefox 53 trở lên. Đã thử nghiệm 0.0.8 với Firefox 69.0 trên Linux.

Dành cho Firefox mà không cần tiện ích bổ sung

Tôi đã đăng một câu trả lời riêng ở bên dưới (nhấp hoặc cuộn xuống) hoạt động cho mọi bản phát hành Firefox, nhưng không phải là cách dễ nhất và không có phím tắt.

Cách riêng là sử dụng biểu định kiểu tùy chỉnh trong Firefox: userChrome.css

Firefox không tải userChrom.css theo mặc định trong Firefox 69 trở lên. Để làm cho biểu định kiểu tùy chỉnh có hiệu lực trở lại, hãy mở about:configtrong Firefox và đặt tùy chọn toolkit.legacyUserProfileCustomizations.stylesheetsthànhtrue

Trước khi câu trả lời này được cập nhật, Mike G đã viết một câu trả lời tiếp theo trước đó .

Làm thế nào nó hoạt động

Khối mã sau đây là nội dung userChrome.csssẽ ẩn thanh tab, thanh điều hướng và thanh cuộn trong Firefox. Đảm bảo sử dụng tên và ID phần tử hợp lệ .

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

Giới hạn: Không có phím tắt. Vô dụng để kích hoạt hoặc vô hiệu hóa theo yêu cầu.

• Để khôi phục giao diện mặc định, đổi tên thành tên userChrome.csskhác userChrome.tmpvà khởi động lại Firefox để có hiệu lực.

• Để sử dụng song song với một phiên bản khác của Firefox với giao diện mặc định, hãy sử dụng một cấu hình riêng .

Tất cả các cấu hình được lưu trữ trong thư mục hồ sơ , có thể được định vị từ Firefox bằng thanh menu hoặc thanh công cụ, sau đó điều hướng đến Trợ giúp> Thông tin khắc phục sự cố .

Cách thiết lập và sử dụng

Sau đây là các bước chung bất kể nền tảng hệ thống.

1. Chạy Trình quản lý hồ sơ của Firefox, sau đó tạo một hồ sơ mới có tên 'hidebars' (bất kỳ tên nào bạn chọn) và đóng Trình quản lý hồ sơ.

2. Chạy trình quản lý tệp và mở thư mục hồ sơ đã được tạo ở bước 1.

3. Trong thư mục hồ sơ mới, tạo các tệp mới chrome/userChrome.css bao gồm thư mục mẹ chromenếu không tồn tại.

4. Sao chép và dán nội dung của userChrome.csstừ ở trên vào tệp tạo ở bước 3.

5. Cuối cùng, lưu và đóng tệp.

Để bắt đầu sử dụng, hãy chạy phiên bản Firefox với cấu hình mới.

Kết hợp ảnh chụp màn hình sau đây cho thấy Firefox Legacy (trái) và Firefox Quantum trên Linux, mỗi lần duyệt ở kích thước cửa sổ nhỏ khi biểu định kiểu tùy chỉnh được sử dụng.

Hoạt động với tất cả các bản phát hành của Firefox, ngoại trừ Firefox 69 và sau đó bỏ qua userChrome.css theo mặc định. Đã thử nghiệm với Firefox 10, 20, 50 (Firefox Legacy) và 60, 63, 69 (Firefox Quantum) trên Linux và tất cả dường như hoạt động như mong đợi.

Người giới thiệu

• Câu trả lời này của user1929 trên Diễn đàn hỗ trợ Firefox đã đề cập đến #TabToolbartên thành phần và ID để sửa đổi thanh tab.

• Tệp tùy chỉnh này của Timvde trên GitHub đã đề cập đến #navigator-toolboxtên thành phần và ID để sửa đổi thanh điều hướng.

• Câu trả lời này của cor-el trên Diễn đàn hỗ trợ Firefox đã đề cập đến #content browsertên thành phần và ID để sửa đổi thanh cuộn.

• CSS tràn trên w3school để hiểu overflowlà không cần thiết.

• Khả năng hiển thị CSS Thuộc tính trên w3school để hiểu giá trị cho visibility.

• Ý nghĩa của việc sử dụng trên mạng! Quan trọng trong CSS là gì? trên Stack Overflow để hiểu !importantlà không cần thiết.

• Firefox 60 đã phá vỡ thanh cuộn css và Hide Scrollbar Firefox 60: FirefoxCSS trên reddit.com cả hai đề nghị gỡ bỏ #contentvà chỉ để lại browserẩn scollbar đúng cách.

• Firefox 69: userChrome.css và userContent.css tắt theo mặc định trên ghacks.net và PSA: Firefox người dùng v69 sẽ phải thiết lập một pref để cho phép userChrome.css và userContent.css trên reddit.com cả đã ghi nhận một sở thích mới toolkit.legacyUserProfileCustomizations.stylesheetstrong about:config.

Lưu ý của người trả lời: Câu trả lời này được viết hai năm sau , chỉ sau khi tôi đã đề nghị sử dụng tiện ích bổ sung trong câu trả lời đầu tiên . Kể từ đó, một số câu trả lời khác dựa trên userChrom.css đã được viết thay vì cải thiện câu trả lời này. Do đó, câu trả lời này hiện là một wiki cộng đồng, để bất kỳ ai có danh tiếng tối thiểu đều có thể cải thiện bài đăng này để theo kịp những thay đổi mới nhất trong Firefox.

Tôi biết điều này là siêu muộn, nhưng tôi đã tạo một bookmarklet cho việc này, nó không yêu cầu tiện ích bổ sung và không tải xuống :)

Lưu mã JavaScript sau dưới dạng bookmarklet và nhấp vào mã trên trang bạn muốn xem trong cửa sổ tối thiểu mới:

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

Nhấn vào đây để làm cho quá trình dễ dàng hơn! | Thư viện

Lưu ý: Điều này sẽ hoạt động trong tất cả các trình duyệt

Tôi yêu Firefox và Vivaldi. Một trong những tính năng tốt nhất của Vivaldi (tôi là người sử dụng cử chỉ chuột) là nó có rất nhiều tùy chọn (thanh bên, dấu trang, thanh địa chỉ, thanh trạng thái, v.v.) có thể điều chỉnh và di chuyển ...

Một phím tắt có nội dung 'Ẩn UI'. Mọi thứ biến mất ... vì vậy khi bạn không cần phải xem các tab / thanh addy, v.v. thì tôi chỉ cần làm một con chuột ngồi xổm và còn lại với trang và cửa sổ.

Ma thuật.

Thậm chí tốt hơn, màu cửa sổ lấy gợi ý từ trang web và hoạt động rất tốt - pha trộn độc đáo.

Tôi biết là muộn, nhưng có lẽ ai đó sẽ thích.

Nếu bạn chỉ muốn ẩn các thành phần UI của Firefox cho đến khi chúng cần thiết thì có lẽ tôi userChrome.csslà dành cho bạn. (làm việc trên FF 70.0.1)

• Thanh tab bị ẩn nếu chỉ có một tab
• Thanh địa chỉ bị ẩn cho đến khi tập trung với Ctrl-L, F6 và tương tự
• Thanh cuộn bên phải được gỡ bỏ

Để ẩn thanh tab, bạn sẽ cần sử dụng Firefox customize(chỉ cần nhấp chuột phải vào thanh tab) để kéo newtab (+) buttonthanh tab ra và đảm bảo bạn đang sử dụng hệ thống Titlebar(sao cho cửa sổ tối thiểu, tối đa và các nút đóng không có trên thanh tab). Nếu không, các nút đó sẽ cản trở việc ẩn.

Hướng dẫn về nơi đặt userChrome.csstệp và cách kích hoạt nó có thể được tìm thấy trong bài đăng tuyệt vời này: /superuser//a/1269912/1107142

Tóm tắt nhanh của tôi:

• trên about:configtrang chuyển toolkit.legacyUserProfileCustomizations.stylesheetssangtrue
• lấy Profile Directorytừ about:supporttrang
• tạo một thư mục được gọi chrometrongProfile Directory
• đặt userChrome.csstập tin vào chromethư mục đó

UserChrom.css của tôi, sao chép và dán tùy ý:

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

Tùy chọn tốt nhất mà tôi biết là chế độ toàn màn hình, được bật F11trong tất cả các trình duyệt hiện đại. Điều đó sẽ ẩn nền máy tính để bàn của bạn và các ứng dụng khác, tuy nhiên, có thể không phải là những gì bạn muốn. Nó chỉ đơn giản sẽ lấp đầy khoảng trống xung quanh nội dung của ứng dụng web bằng màu trắng (hoặc bất kỳ màu nền / hình ảnh nào trong biểu định kiểu của ứng dụng web là).

Bạn có thể chạy cửa sổ ứng dụng của mình từ dòng lệnh

"c: \ Tệp chương trình \ Mozilla Firefox" \ firefox.exe -chrom " http://www.example.com "

và đặt trên một máy tính để bàn mở rộng với một nền tảng của sự lựa chọn của bạn.

Các câu hỏi về cách thực hiện việc này trong Firefox Quantum ( > = 57 ) có thể trả lời câu hỏi này ( Firefox Quantum (> = 57) Làm cách nào để chuyển đổi tất cả các thanh công cụ? (Với phím tắt, như F11 nhưng trong cửa sổ, không phải toàn màn hình) )

F11 / Toàn màn hình đôi khi không thực tế.
Nếu bạn chỉ muốn chuyển đổi các thanh công cụ trong các phiên bản Firefox trước 57 thì có thể với addon "Dorando keyconfig":

1. chỉ định một tập lệnh trong Dorando "Trình chỉnh sửa khóa":

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. ánh xạ nó tới một phím tắt thông qua giao diện bổ trợ Dorando

bạn nên thử thông số lệnh --kioskmới từ Firefox v.71 mới

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

Lưu ý rằng câu trả lời từ Clearkimura ở trên, gợi ý sử dụng biểu định kiểu, cần một chút tinh chỉnh trong các phiên bản Firefox sau này. Giải pháp đã làm việc cho tôi khi tôi làm điều này. Từ này trang web:

Đặt Firefox để tìm kiếm userChrome.css khi khởi động (cập nhật 24/24/2019)

Để giúp khởi động nhanh hơn cho hầu hết người dùng, Firefox 69 sẽ không còn tự động tìm tệp này nữa. Bạn cần nói với nó để xem xét. Đây là cách thực hiện:

1. Trong một tab mới, nhập hoặc dán about: config vào thanh địa chỉ và nhấn Enter / Return. Nhấn vào nút chấp nhận rủi ro.
2. Trong hộp tìm kiếm phía trên danh sách, nhập hoặc dán userprof và tạm dừng trong khi danh sách được lọc. Nếu bạn không thấy bất cứ điều gì trong danh sách, xin vui lòng bỏ qua phần còn lại của các hướng dẫn này. Bạn có thể đóng tab này ngay bây giờ.
3. Bấm đúp vào bộ công cụ.legacyUserProfileCustominating.stylesheets để chuyển giá trị từ false thành true.

Sự thay đổi đó sẽ có hiệu lực trong lần khởi động tiếp theo của bạn.