API Polyfill hình ảnh đáp ứng QA cho các ứng dụng web khác nhau
Picturefill là một API dễ sử dụng, thông minh và đáp ứng có thể được sử dụng trong các ứng dụng web khác nhau để đảm bảo rằng người dùng thấy đúng kích thước, độ phân giải màn hình và hơn thế nữa tùy thuộc vào thiết bị.
Là một API polyfill hình ảnh đáp ứng, Picturefill là mã nguồn mở và miễn phí sử dụng và đã được phát triển bằng Javascript và HTML. Được sử dụng chủ yếu cho giao diện người dùng của các ứng dụng, nó có thể là một bổ sung tuyệt vời cho bất kỳ dự án nào mà người dùng cuối có thể có các thiết bị khác nhau mà họ truy cập vào ứng dụng.
Picturefill cung cấp hỗ trợ và tính năng bổ sung cho các phần tử Hình ảnh và Hình ảnh trong trình duyệt. Đây là một trong những cách dễ nhất để đảm bảo rằng bất kể người dùng của bạn đang truy cập trang web của bạn từ thiết bị nào, hình ảnh sẽ tự động điều chỉnh theo kích thước và độ phân giải màn hình của họ. Picturefill đã được thử nghiệm cho nhiều trình duyệt bao gồm Safari, Internet Explorer 9, Google Chrome Mozilla Firefox, v.v.
Bắt đầu với PictureFill
Cách được đề xuất để cài đặt PictureFill qua NPM. Vui lòng sử dụng lệnh sau để cài đặt nó.
Cài đặt PictureFill qua NPM
npm install picturefillThêm hình ảnh đáp ứng qua API JavaScript miễn phí
Thư viện PictureFill mã nguồn mở cho phép các nhà phát triển JavaScript thêm hình ảnh đáp ứng vào trang web của họ, bao gồm cả việc đảm bảo rằng người xem có chế độ xem mật độ pixel cao có thể nhìn thấy nội dung có độ phân giải cao và nó sẽ điều chỉnh cho phù hợp. Tương tự, bạn có thể cung cấp cho trình duyệt một số hình ảnh giống hệt nhau nhưng có kích thước khác nhau. Picturefill sẽ phân loại và cung cấp nguồn tốt nhất cho kích thước khung nhìn hiện tại của người dùng, mật độ hiển thị và kích thước của nội dung trong bố cục của trang web. Picturefill cũng cho phép các nhà phát triển quyết định hình ảnh nào được hiển thị tùy thuộc vào khung nhìn của người dùng. Với sự trợ giúp của phần tử hình ảnh, bạn có thể chỉ định các kích thước khác nhau, mức thu phóng, tỷ lệ khung hình, v.v.
Chỉ định điểm ngắt hình ảnh qua API JavaScript miễn phí
Một tính năng khác của Picturefill là khả năng xác định các điểm ngắt hình ảnh cụ thể với các tùy chọn độ phân giải khác nhau cho các hình ảnh nguồn trên trang web. Picturefill cũng cung cấp tùy chọn để quyết định hình ảnh dự phòng cho các định dạng hình ảnh không được hỗ trợ trên một số định dạng nhất định. Bằng cách này, trang web của bạn sẽ không xuất hiện lỗi hiển thị hình ảnh.
Hỗ trợ trình duyệt
Thư viện hình ảnh mở cung cấp sự hỗ trợ hoàn toàn cho các loại trình duyệt khác nhau. Thư viện được kiểm tra và làm việc suôn sẻ với một số lượng lớn các trình duyệt, như Firefox, Google Chrome, Internet Explorer, Safari, Opera, và nhiều hơn nữa. Khi JavaScript bị vô hiệu hóa, trình duyệt có thể nhìn thấy tin của các vị trí như một sự hỗ trợ. Thư viện đã hỗ trợ đầy đủ cho In9 và kể cả phiên bản cũ. Cho In9 và sau đó, anh sẽ cần phải đóng gói một phần tử video quanh các nguyên tố nguồn gốc trong tấm ảnh của anh. Ví dụ sau đây cho thấy làm thế nào.
