QA Responsive Image Polyfill API für verschiedene Webanwendungen
Picturefill ist eine benutzerfreundliche, intelligente und reaktionsschnelle API, die in verschiedenen Webanwendungen verwendet werden kann, um sicherzustellen, dass Benutzer je nach Gerät die richtige Größe, Bildschirmauflösung und mehr sehen.
Als auffälliges Bild polyfill API, ist Picturefill offen und frei zu benutzen und wurde mit Javascript und HTML entwickelt. Hauptsächlich für das Frontend von Anwendungen verwendet, kann es eine großartige Ergänzung zu jedem Projekt bilden, in dem Endbenutzer unterschiedliche Geräte haben, auf denen sie auf die Anwendung zugreifen können.
Picturefill bietet zusätzliche Unterstützung und Funktionen für Picture- und Img-Elemente in Browsern. Es ist eine der einfachsten Möglichkeiten, sicherzustellen, dass die Bilder, egal von welchem Gerät Ihre Benutzer auf Ihre Website zugreifen, automatisch auf ihre Bildschirmgröße und -auflösung angepasst werden. Picturefill wurde für viele Browser wie Safari, Internet Explorer 9, Google Chrome Mozilla Firefox und vieles mehr getestet.
Erste Schritte mit PictureFill
Die empfohlene Methode zur Installation von PictureFill über NPM. Bitte verwenden Sie den folgenden Befehl, um es zu installieren.
Installieren Sie PictureFill über NPM
npm install picturefillFügen Sie responsive Bilder über die kostenlose JavaScript-API hinzu
Die Open-Source PictureFill Bibliothek erlaubt JavaScript Entwicklern, auffällige Bilder zu ihrer Site hinzuzufügen, einschließlich sicherzustellen, dass Viewer mit hohen Pixeldichte-Aussichtspunkten hohe Auflösungsvermögen sehen können und sie sich entsprechend anpassen. In ähnlicher Weise können Sie dem Browser eine Anzahl von Bildern zur Verfügung stellen, die identisch sind, jedoch in unterschiedlichen Größen. Picturefill liefert die beste Quelle für die aktuelle Aussichtspunktgröße, Anzeigedichte und die Größe des Vermögens im Layout der Website. Picturefill erlaubt es Entwicklern auch, abhängig vom Standpunkt des Benutzers zu entscheiden, welche Bilder angezeigt werden. Mit Hilfe des Bildelements können Sie verschiedene Größen, Zoomstufen, Seitenverhältnisse usw. festlegen.
Geben Sie den Bildhaltepunkt über die kostenlose JavaScript-API an
Eine weitere Funktion von Picturefill ist die Möglichkeit, bestimmte Bildhaltepunkte mit unterschiedlichen Auflösungsoptionen für Quellbilder auf der Website zu definieren. Picturefill bietet auch die Option, Fallback-Bilder für Bildformate festzulegen, die von bestimmten Formaten nicht unterstützt werden. Auf diese Weise zeigt Ihre Website keine Bildanzeigefehler an.
Browser Support
Die Open Source Picturefill-Bibliothek hat verschiedene Browsertypen vollständig unterstützt. Die Bibliothek wird getestet und funktioniert reibungslos auf einer großen Anzahl von Browsern, wie Firefox, Google Chrome, Internet Explorer, Safari, Opera und vieles mehr. Wenn JavaScript deaktiviert ist, kann der Browser den alt-Attribut-Text als Fullback sehen. Die Bibliothek hat die volle Unterstützung für In9 und sogar die ältere Version enthalten. Für In9 & höher müssen Sie einen Videoelement Wrapper um die Quellelemente Ihres Bildtags umwickeln. Das folgende Beispiel zeigt, wie man es macht.
