2012-10-10 27 views
5

Tôi có một ứng dụng web mà tôi trước đây đã thiết lập các thẻ meta cần thiết để hỗ trợ cho iPhone với một bookmark màn hình chính. Trang web hoạt động tốt trong safari, và như là đánh dấu với thiết bị táo-di động-web-ứng dụng có khả năng để có để nó loại bỏ các điều khiển trình duyệt khi bạn sử dụng liên kết màn hình chủ.iPhone viewport thẻ meta thay đổi vào liên kết màn hình

Bây giờ iPhone 5 được ra ngoài, tôi nhận ra rằng với các thiết lập viewport tôi đã có trên trang nó được hiển thị các trang web với các thanh màu đen ở phía trên và phía dưới màn hình. Tôi đã thay đổi thẻ meta viewport của mình để nó sẽ sử dụng toàn màn hình của iPhone 5. Tuy nhiên, cách duy nhất để đánh dấu màn hình chủ sử dụng các thẻ khung nhìn mới và đi toàn màn hình là xóa dấu trang và thêm lại nó.

Có cách nào khác để thiết lập mọi thứ để mọi người có dấu trang màn hình đã được cài đặt sẽ không cần phải xóa và thêm lại để trang web có toàn màn hình không?

Trả lời

5

Đây là giải pháp tôi tìm thấy bởi Burlin trên Gist. Làm việc một điều trị. https://gist.github.com/3840737

<!-- standard viewport tag to set the viewport to the device's width 
    , Android 2.3 devices need this so 100% width works properly and 
    doesn't allow children to blow up the viewport width--> 
<meta name="viewport" id="vp" content="initial-scale=1.0,user-scalable=no,maximum-scale=1,width=device-width" /> 
<!-- width=device-width causes the iPhone 5 to letterbox the app, so 
    we want to exclude it for iPhone 5 to allow full screen apps --> 
<meta name="viewport" id="vp" content="initial-scale=1.0,user-scalable=no,maximum-scale=1" media="(device-height: 568px)" /> 
+0

Điều này thật tuyệt, nhưng bạn đã bao gồm hai ID giống hệt nhau cho mục đích gì? – fisherwebdev

Các vấn đề liên quan