iPad WebApp Toàn màn hình trong Safari

83

Apple cho biết trong tham chiếu HTML của Safari rằng đoạn mã dưới đây được cho là làm cho ứng dụng web toàn màn hình trên iPhone OS 2.1 trở lên.

 <meta name="apple-mobile-web-app-capable" content="yes">

Nhưng nó dường như không hoạt động. Có cách nào để ẩn tiêu đề / thanh vị trí trong Safari trong WebApp iPad không?

ipad  web-applications  iphone-standalone-web-app 
— ChrisB
nguồn

Câu trả lời:

120

Điều này chỉ hoạt động sau khi bạn lưu dấu trang vào ứng dụng vào màn hình chính. Không phải nếu bạn chỉ duyệt trang web bình thường.

— jamone
nguồn
13
Nếu bạn thêm thẻ meta này vào trang web url cũ mà bạn đã duyệt trước đó trên Safari, trước tiên bạn cần phải làm mới url sau đó thêm nó vào màn hình chính để thẻ meta hoạt động.
— Scott Chu,
Điều này không phù hợp với tôi trong một dự án laravel. Tôi đã thêm cái này vào mẫu bố cục app.blade của mình. Điều này được sử dụng bởi mỗi trang của tôi, vì vậy tiêu đề nên (và không) xuất hiện trên mỗi trang. Tuy nhiên, tôi vẫn có các thanh Safari trên iPhone và iPad của mình ngay cả sau khi thực hiện rất nhiều thử nghiệm xóa bộ nhớ cache, tạo lại phím tắt màn hình chính như đã đề cập trong bài đăng này. Có thứ gì khác có thể ngăn các thanh safari ẩn náu không? pastebin.com/iSFDXjFz đây là phần đầu của tệp app.blade.php của tôi. Cảm ơn trước.
— Frantumn
14

Nếu bạn muốn ở trong trình duyệt mà không cần mở cửa sổ mới, hãy sử dụng mã HTML này:

<a href="javascript:this.location = 'index.php?page=1'">
— Remco de Jong
nguồn
4
Điều này có vẻ không liên quan đến câu hỏi hoặc chủ đề hiện tại. Có lẽ bạn có thể giải thích nó liên quan như thế nào?
— xiên
6
Rất phù hợp. Đây luôn là vấn đề tiếp theo sau khi ứng dụng web toàn màn hình.
— tomwagon
Đối với tôi, vấn đề tiếp theo là "làm cách nào để làm mới trang khi nó đang ở chế độ toàn màn hình?"
— Nick
13

  1. Đầu tiên, khởi chạy trình duyệt Safari của bạn từ Màn hình chính và truy cập trang web mà bạn muốn xem toàn màn hình.

  2. Sau khi định vị trang web, hãy nhấn vào biểu tượng mũi tên ở đầu màn hình của bạn.

  3. Trong menu thả xuống, hãy nhấn vào tùy chọn Thêm vào Màn hình chính.

  4. Cửa sổ Thêm vào Trang chủ sẽ được hiển thị. Bạn có thể tùy chỉnh mô tả sẽ xuất hiện dưới dạng tiêu đề trên màn hình chính của iPad. Khi bạn hoàn tất, hãy nhấn vào nút Thêm.

  5. Một biểu tượng mới bây giờ sẽ xuất hiện trên màn hình chính của bạn. Nhấn vào biểu tượng sẽ mở trang web ở chế độ toàn màn hình.

Lưu ý: Biểu tượng trên màn hình chính iPad của bạn chỉ mở trang đã đánh dấu ở chế độ toàn màn hình. Trang tiếp theo bạn truy cập sẽ chứa địa chỉ Safari và các thanh tiêu đề. Cách này để phát trang web hoặc bản trình bày HTML5 của bạn ở chế độ toàn màn hình sẽ hoạt động nếu mã nguồn của trang web chứa thẻ sau:

<meta name="apple-mobile-web-app-capable" content="yes">

Bạn có thể thêm thẻ này vào trang web của mình bằng công cụ của bên thứ ba, ví dụ: Công cụ SEO iWeb hoặc bất kỳ công cụ nào khác mà bạn thích. Xin lưu ý rằng bạn cần thêm thẻ trước, làm mới trang và sau đó thêm dấu trang vào màn hình chính của bạn.

— Code.Town
nguồn
Bạn có thể nói rằng đây là bản sao trực tiếp của một hướng dẫn được tìm thấy tại ispringsolutions.com/articles/… :-)
— Jochem Schulenklopper vào
3
Và có thể họ đã sao chép của tôi. :) Nhìn vào ngày mà tôi đã trả lời cho câu hỏi này và so sánh nó với ngày xuất bản của họ.
— Code.Town
Chúc mừng! Đây là một loại bạn. :)
— Code.Town
0

Có vẻ như hầu hết các câu trả lời trên chủ đề này đã không theo kịp. iOS Safari trên iPad hiện đã hỗ trợ toàn màn hình và rất dễ triển khai bằng javascript.

Đây là bài viết đầy đủ của tôi về cách triển khai khả năng toàn màn hình trên ứng dụng web của bạn.

— Marvin Danig
nguồn
Khi sử dụng trang web của chúng tôi, bạn xác nhận rằng bạn đã đọc và hiểu Chính sách cookie và Chính sách bảo mật của chúng tôi.
Licensed under cc by-sa 3.0 with attribution required.