QA Responsive Image Polyfill API különböző webes alkalmazásokhoz
A Picturefill egy könnyen használható, intelligens és reszponzív API, amely különféle webalkalmazásokban használható, így biztosítva, hogy a felhasználók a megfelelő méretet, képernyőfelbontást és egyebeket lássák az eszköztől függően.
Reszponzív kép polifill API-ként a Picturefill nyílt forráskódú, ingyenesen használható, és Javascript és HTML használatával lett kifejlesztve. Főleg az alkalmazások elülső részében használják, és nagyszerű kiegészítője lehet minden olyan projektnek, ahol a végfelhasználók különböző eszközökkel érhetik el az alkalmazást.
A Picturefill további támogatást és funkciókat biztosít a Picture és Img elemekhez a böngészőkben. Ez az egyik legegyszerűbb módja annak biztosítására, hogy függetlenül attól, hogy a felhasználók melyik eszközről érik el webhelyét, a képek automatikusan a képernyő méretéhez és felbontásához igazodnak. A Picturefill-t számos böngészőben tesztelték, beleértve a Safarit, az Internet Explorer 9-et, a Google Chrome Mozilla Firefoxot és még sok mást.
A PictureFill első lépései
A PictureFill NPM-en keresztüli telepítésének javasolt módja. Kérjük, használja a következő parancsot a telepítéshez.
Telepítse a PictureFill-t NPM-en keresztül
npm install picturefillAdjon hozzá reagáló képeket ingyenes JavaScript API-n keresztül
A nyílt forráskódú PictureFill könyvtár lehetővé teszi a JavaScript-fejlesztők számára, hogy reszponzív képeket adjanak webhelyükhöz, így biztosítva, hogy a nagy pixelsűrűségű nézetablakokkal rendelkező nézők lássák a nagy felbontású elemeket, és ennek megfelelően módosítsa őket. Hasonlóképpen, számos azonos, de eltérő méretű képet is elhelyezhet a böngészőben. A Picturefill kiválogatja, és a legjobb forrást nyújtja a felhasználó jelenlegi nézetablakának méretéhez, megjelenítési sűrűségéhez és a webhely elrendezésében szereplő elem méretéhez. A Picturefill lehetővé teszi a fejlesztők számára, hogy eldöntsék, mely képek jelenjenek meg a felhasználó nézetétől függően. A képelem segítségével különböző méreteket, nagyítási szinteket, képarányokat stb.
Adja meg a képtöréspontot az ingyenes JavaScript API-n keresztül
A Picturefill másik funkciója az a képesség, hogy meghatározott képtöréspontokat határozzon meg különböző felbontási lehetőségekkel a webhelyen található forrásképekhez. A Picturefill lehetőséget biztosít arra is, hogy döntsön tartalékképeket olyan képformátumokhoz, amelyeket bizonyos formátumok nem támogatnak. Így webhelye nem jelenít meg képmegjelenítési hibákat.
Böngészők támogatása
A nyílt forráskódú Picturefill könyvtár teljes körű támogatást nyújtott különféle típusú böngészők számára. A könyvtár tesztelve van, és zökkenőmentesen működik számos böngészőn, mint például a Firefox, Google Chrome, Internet Explorer, Safari, Opera és még sok más. Ha a JavaScript le van tiltva, a böngésző tartalékként láthatja az alt attribútum szövegét. A könyvtár teljes mértékben támogatja az IE9-et és még a régebbi verziót is. IE9 és újabb verziók esetén a képcímkében lévő forráselemek köré videoelem-burkolót kell körbevennie. A következő példa bemutatja, hogyan kell csinálni.
