QA Responsive Image Polyfill API за различни уеб приложения
Picturefill е лесен за използване, интелигентен и отзивчив API, който може да се използва в различни уеб приложения, за да се гарантира, че потребителите виждат правилния размер, разделителна способност на екрана и други в зависимост от устройството.
Като адаптивен API за многозапълване на изображения, Picturefill е с отворен код и е безплатен за използване и е разработен с помощта на Javascript и HTML. Използва се главно за предния край на приложенията и може да бъде чудесно допълнение към всеки проект, където крайните потребители може да имат различни устройства, на които имат достъп до приложението.
Picturefill предоставя допълнителна поддръжка и функции за елементите Picture и Img в браузърите. Това е един от най-лесните начини да гарантирате, че без значение от кое устройство вашите потребители имат достъп до уебсайта ви, изображенията автоматично се настройват към размера и разделителната способност на екрана. Picturefill е тестван за много браузъри, включително Safari, Internet Explorer 9, Google Chrome Mozilla Firefox и други.
Първи стъпки с PictureFill
Препоръчителният начин за инсталиране на PictureFill чрез NPM. Моля, използвайте следната команда, за да го инсталирате.
Инсталирайте PictureFill чрез NPM
npm install picturefillДобавете адаптивни изображения чрез безплатен JavaScript API
Библиотеката PictureFill с отворен код позволява на разработчиците на JavaScript да добавят отзивчиви изображения към своя сайт, включително да се уверят, че зрителите с прозорци с висока плътност на пикселите могат да виждат активи с висока разделителна способност и да се коригира съответно. По същия начин можете да предоставите на браузъра няколко изображения, които са идентични, но с различни размери. Picturefill ще сортира и ще осигури най-добрия източник за текущия размер на прозореца за изглед на вашия потребител, плътността на дисплея и размера на актива в оформлението на уебсайта. Picturefill също така позволява на разработчиците да решават кои изображения да се показват в зависимост от прозореца за изглед на потребителя. С помощта на елемента картина можете да зададете различни размери, нива на увеличение, съотношения на страните и т.н.
Посочете точка на прекъсване на изображението чрез безплатен JavaScript API
Друга характеристика на Picturefill е възможността да се определят конкретни точки на прекъсване на изображението с различни опции за разделителна способност за изходни изображения на уебсайта. Picturefill предоставя също опцията за избор на резервни изображения за графични формати, които не се поддържат в определени формати. По този начин вашият уебсайт няма да показва грешки при показване на изображения.
Поддръжка на браузъри
Библиотеката Picturefill с отворен код предоставя пълна поддръжка за различни видове браузъри. Библиотеката е тествана и работи безпроблемно на голям брой браузъри, като Firefox, Google Chrome, Internet Explorer, Safari, Opera и много други. Когато JavaScript е деактивиран, браузърът може да види текста на атрибута alt като резервен вариант. Библиотеката включва пълна поддръжка за IE9 и дори по-старата версия. За IE9 и по-нови версии ще трябва да обвиете обвивка на видео елемент около изходните елементи във вашия етикет за картина. Следващият пример показва как да го направите.
