2009-08-03 37 views
6

Có cách nào để Mobile Safari nhận ra trang web dành cho điện thoại di động và tự động phóng to không? Tính năng này hoạt động như thế nào trên các điện thoại và trình duyệt khác?zoom tự động trên iPhone safari

Tôi muốn tránh xem user_agent và gửi một trang khác cho từng trình duyệt di động.

Trả lời

9

Xem configuring the viewport phần của hướng dẫn phát triển ứng dụng web của Apple.

+1

Phải, đây là những gì tôi nghĩ câu hỏi đã đề cập đến. Ví dụ: thêm phần tử trông giống như:

+0

Cảm ơn! Nó cũng hoạt động trong Opera Mini. Không chắc chắn về các trình duyệt khác .. – m33lky

0

Trang web có thể nhận ra trình duyệt dành cho thiết bị di động và tạo ra kết quả đầu ra tương ứng, đó thường là cách bạn muốn.

Safari sẽ phát hiện chiều rộng và zoom-to-fit, nhưng ngoài ra ...

0

Bạn có thể tránh việc có các trang khác nhau dựa trên Tác nhân người dùng bằng cách sử dụng CSS có điều kiện. Apple thực sự có một số tài liệu rất tốt về việc tạo các trang web có thể hỗ trợ Safari trên iPhone cùng với các trình duyệt trên máy tính để bàn.

Tôi khuyên bạn nên bắt đầu bằng cách đọc iPhone Human Interface Guidelines for Web Applications. Điều này sẽ cung cấp cho bạn một khởi đầu tốt trong việc sử dụng CSS có điều kiện để tùy chỉnh các trang dựa trên các đặc tính của thiết bị (chẳng hạn như kích thước màn hình) thay vì Tác nhân người dùng.

1

Tôi chỉ nhận thấy rằng nếu bạn có chiều cao cơ thể hoặc chiều cao bao bọc chính được đặt thành 100%, điều này có thể gây rối với mức độ phóng to/hiển thị của trình duyệt trên thiết bị di động. Xác nhận điều này trong safari di động và trình duyệt chrome của Android. Khi tôi đặt chiều cao #siteWrapper từ 100% thành tự động, nó sẽ được hiển thị ở tỷ lệ tốt hơn nhiều.

(chiều cao 100% trên trình bao bọc chính thường được sử dụng với chân trang dính.)

+0

Đây không phải là vấn đề tôi đã gặp nhưng nó đã cho tôi một đầu mối. Hóa ra việc xóa một khai báo chiều rộng tối thiểu đã giải quyết được vấn đề của tôi. – tanman

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