QA Responsive Image Polyfill API för olika webbapplikationer
Picturefill är ett lättanvänt, smart och responsivt API som kan användas i olika webbapplikationer för att se till att användarna ser rätt storlek, skärmupplösning med mera beroende på enhet.
Som ett responsivt bildpolyfill-API är Picturefill öppen källkod och gratis att använda och har utvecklats med Javascript och HTML. Den används huvudsakligen för applikationernas frontend och kan vara ett bra tillägg till alla projekt där slutanvändare kan ha olika enheter som de får åtkomst till applikationen på.
Picturefill ger ytterligare stöd och funktioner för bild- och bildelementen i webbläsare. Det är ett av de enklaste sätten att säkerställa att bilderna automatiskt anpassar sig till deras skärmstorlek och upplösning, oavsett vilken enhet dina användare kommer åt din webbplats från. Picturefill har testats för många webbläsare inklusive Safari, Internet Explorer 9, Google Chrome Mozilla Firefox och mer.
Komma igång med PictureFill
Det rekommenderade sättet att installera PictureFill via NPM. Använd följande kommando för att installera det.
Installera PictureFill via NPM
npm install picturefillLägg till responsiva bilder via gratis JavaScript API
PictureFill-biblioteket med öppen källkod tillåter JavaScript-utvecklare att lägga till responsiva bilder på sin webbplats, inklusive att se till att tittare med visningsportar med hög pixeltäthet kan se högupplösta tillgångar och det anpassar sig därefter. På samma sätt kan du förse webbläsaren med ett antal bilder som är identiska men med olika storlekar. Picturefill kommer att sortera ut och tillhandahålla den bästa källan för din användares nuvarande visningsportstorlek, visningstäthet och storleken på tillgången i webbplatsens layout. Picturefill låter också utvecklare bestämma vilka bilder som ska visas beroende på användarens visningsport. Med hjälp av bildelementet kan du specificera olika storlekar, zoomnivåer, bildförhållanden mm.
Ange Image Breakpoint via Free JavaScript API
En annan funktion i Picturefill är möjligheten att definiera specifika bildbrytpunkter med olika upplösningsalternativ för källbilder på webbplatsen. Picturefill ger också möjlighet att bestämma reservbilder för bildformat som inte stöds i vissa format. På så sätt kommer inte din webbplats att visa bildvisningsfel.
Stöd för webbläsare
Picturefill-biblioteket med öppen källkod har gett komplett stöd för olika typer av webbläsare. Biblioteket är testat och fungerar smidigt på ett stort antal webbläsare, som Firefox, Google Chrome, Internet Explorer, Safari, Opera och många fler. När JavaScript är inaktiverat kan webbläsaren se alt-attributtexten som en reserv. Biblioteket har inkluderat fullt stöd för IE9 och även den äldre versionen. För IE9 och senare måste du linda en videoelementomslag runt källelementen i din bildtagg. Följande exempel visar hur man gör.
