Müxtəlif Veb Tətbiqləri üçün QA Responsive Image Polyfill API
Picturefill istifadəsi asan, ağıllı və həssas API-dir və istifadəçilərin cihazdan asılı olaraq düzgün ölçü, ekran təsvir ölçüsü və daha çoxunu görməsinə əmin olmaq üçün müxtəlif veb proqramlarında istifadə edilə bilər.
Responsive image polyfill API kimi, Picturefill açıq mənbədir və istifadəsi pulsuzdur və Javascript və HTML istifadə edərək işlənib hazırlanmışdır. Əsasən tətbiqlərin ön hissəsi üçün istifadə olunur, o, son istifadəçilərin proqrama daxil olduqları müxtəlif cihazlara malik ola biləcəyi istənilən layihəyə əla əlavə edə bilər.
Picturefill brauzerlərdə Şəkil və Şəkil elementləri üçün əlavə dəstək və funksiyalar təmin edir. Bu, istifadəçilərinizin vebsaytınıza hansı cihazdan daxil olmasından asılı olmayaraq, şəkillərin avtomatik olaraq ekran ölçüsünə və həllinə uyğunlaşmasını təmin etməyin ən asan yollarından biridir. Picturefill Safari, Internet Explorer 9, Google Chrome Mozilla Firefox və daha çox daxil olmaqla bir çox brauzerlər üçün sınaqdan keçirilmişdir.
PictureFill ilə işə başlamaq
PictureFill-i NPM vasitəsilə quraşdırmağın tövsiyə olunan yolu. Quraşdırmaq üçün aşağıdakı əmrdən istifadə edin.
PictureFill-i NPM vasitəsilə quraşdırın
npm install picturefill
Pulsuz JavaScript API vasitəsilə cavab verən şəkillər əlavə edin
Açıq mənbəli PictureFill kitabxanası JavaScript tərtibatçılarına öz saytlarına cavab verən şəkillər əlavə etməyə imkan verir, o cümlədən yüksək piksel sıxlığı baxış pəncərələri olan izləyicilərin yüksək ayırdetmə qabiliyyətinə malik aktivləri görə bildiyinə əmin olmaq və buna uyğun olaraq tənzimləmə. Eynilə, siz brauzeri eyni, lakin müxtəlif ölçülü şəkillərlə təmin edə bilərsiniz. Picturefill istifadəçinizin cari baxış pəncərəsinin ölçüsü, ekran sıxlığı və veb saytın tərtibatındakı aktivin ölçüsü üçün ən yaxşı mənbəni çeşidləyəcək və təmin edəcək. Picturefill həmçinin tərtibatçılara istifadəçinin baxış pəncərəsindən asılı olaraq hansı şəkillərin göstəriləcəyinə qərar verməyə imkan verir. Şəkil elementinin köməyi ilə siz müxtəlif ölçüləri, böyütmə səviyyələrini, aspekt nisbətlərini və s. təyin edə bilərsiniz.
Pulsuz JavaScript API vasitəsilə Image Breakpoint təyin edin
Picturefill-in başqa bir xüsusiyyəti veb-saytdakı mənbə şəkilləri üçün müxtəlif qətnamə seçimləri ilə xüsusi təsvir kəsilmə nöqtələrini təyin etmək imkanıdır. Picturefill həmçinin müəyyən formatlarda dəstəklənməyən şəkil formatları üçün ehtiyat şəkillərə qərar vermək seçimini təmin edir. Bu şəkildə veb saytınız təsvirin göstərilməsi xətalarını göstərməyəcək.
Brauzer dəstəyi
Açıq mənbə Picturefill kitabxanası müxtəlif növ brauzerlər üçün tam dəstək verir. Kitabxana sınaqdan keçirilib və Firefox, Google Chrome, Internet Explorer, Safari, Opera və bir çox başqa brauzerlərdə rəvan işləyir. JavaScript deaktiv edildikdə, brauzer alt atribut mətnini ehtiyat kimi görə bilər. Kitabxanaya IE9 və hətta köhnə versiya üçün tam dəstək daxildir. IE9 və sonrakı versiyalar üçün şəkil etiketinizdəki mənbə elementlərinin ətrafına video element sarğısını bükməli olacaqsınız. Aşağıdakı nümunə bunun necə ediləcəyini göstərir.