trình duyệt bổ trợ để kiểm tra thiết kế di động

Question

Có bất kỳ tiện ích bổ sung nào để kiểm tra trang HTML để xem trang này sẽ trông như thế nào trên thiết bị di động không? Tôi đang phát triển với PhoneGap nhưng trình giả lập Eclipse quá chậm để làm mới nó mọi lúc, vì vậy tôi muốn có một tiện ích mở rộng của trình duyệt làm cho độ phân giải màn hình giống như trên thiết bị di động.

Answer 1

Nếu bạn chỉ quan tâm đến kích thước màn hình, Firefox 15 (hiện tại là Beta, bản phát hành sắp tới trong hai tuần) có Responsive Design View trong menu Nhà phát triển web cho phép bạn điều chỉnh "kích thước màn hình". Ví dụ: bạn có thể chọn 360x640 (độ phân giải nHD) và xem trang của mình.

Tuy nhiên, trình duyệt trên điện thoại di động thực hiện điều chỉnh tùy chỉnh cho các trang web và các điều chỉnh này phụ thuộc vào trình duyệt được sử dụng. Ví dụ, Firefox Mobile thực hiện một cái gì đó gọi là Font Inflation. Bạn không thể sao chép nó trong trình duyệt trên máy tính để bàn, bạn phải chạy Firefox Mobile cho điều đó. Vấn đề: trình duyệt di động sẽ chỉ chạy trên điện thoại di động, thậm chí Mozilla đã ngừng cung cấp Firefox Mobile cho máy tính để bàn sau khi họ chuyển sang giao diện người dùng Android gốc.

Chỉnh sửa: Bắt đầu với Firefox 33, có một trình mô phỏng hệ điều hành Firefox được tích hợp vào Firefox (nhờ Tomek để chỉ cho tôi theo hướng này). Để bắt đầu, open WebIDE, sau đó nhấp vào "Chọn thời gian chạy" và chọn "Firefox OS 1.3". Điều này sẽ bắt đầu giả lập, tất cả những gì bạn cần làm sau đó là nhấp vào biểu tượng Firefox (đối với tôi nó là màu xanh dương, không phải màu cam thông thường). Có bạn đang có, bạn có thể kiểm tra bất kỳ trang web trong một trình duyệt di động thực sự, ngay trên máy tính của bạn.

Answer 2

Firefox OS simulator có thể thực hiện thủ thuật: Chỉ cần cài đặt. Chạy nó - và chạy trình duyệt bên trong. :)