HI @ AndreasSchmid1 , danke für deine freundlichen Worte.

Sie können dem Bild eine Animation hinzufügen, z.

img.ng-lazyloaded {
  animation: fadein .5s;
}
<strong i="8">@keyframes</strong> fadein {
  from { opacity: 0; }
  to   { opacity: 1; }
}

(Siehe "Standardbild" auf der Beispielseite: https://tjoskar.github.io/ng-lazyload-image)

Sie können auch einen Übergang zwischen Bildern hinzufügen, wenn Sie zwei Bilder erstellen, eines mit dem Standardbild und eines mit dem Lazyloaded. z.B. https://github.com/tjoskar/ng-lazyload-image/blob/master/example/pixelated-image.component.ts (siehe "Pixeliertes Bild" auf der Beispielseite: https://tjoskar.github.io/ ng-Lazyload-Bild)
Wie Sie vielleicht wissen, können Sie die Animation verlangsamen, um einen besseren Überblick über die Animation zu erhalten (https://developers.google.com/web/tools/chrome-devtools/inspect-styles/animations).

Es ist auch möglich, einen Übergang für background-image hinzuzufügen:

#image {
  height: 250px;
  width: 500px;
  transition: background-image 1s ease-out;
}

md5-a293a4af2fed33e82fce83f3f4407a8e

Auf dieser Seite finden Sie ein Beispiel (ohne ng-lazyload-image): http://jsfiddle.net/8L7775fa/4/

Lassen Sie mich wissen, wenn Sie auf Probleme stoßen.

Hi an alle,
Ich entwickle eine Webanwendung in Winkel 5, in der ich ngx-Bootstrap-Karussell und ng-lazyload-Bild auf meiner HTML-Seite wie folgt verwende. Mein Standardbild wird erfolgreich geladen und zeigt den Spinner, bevor das eigentliche Bild tatsächlich geladen wird. Aber das Problem bin ich Die Ausrichtung meines Standardbilds nimmt ebenfalls entsprechend meiner Karussellgröße zu. Gibt es eine Möglichkeit, die Größe meines Standardbilds zu korrigieren?

Unten ist mein Code ------------------------

[lazyLoad] = "image.carousel_image_key"
[Offset] = "Offset">

Das defaultImage ist ein Spinner-GIF-Bild (stammt von meiner Komponente), das ich den Benutzern anzeigen möchte, bis meine realen Bilder geladen sind ([lazyLoad] = "image.carousel_image_key"). Ich habe die Größe meines Karussells wie unten in festgelegt mein css

mainCarouselImgLayout {

Bildschirmsperre;
Breite: 100%;
Höhe: 400px
}}
Das gleiche CSS wird auf mein Spinnerbild angewendet. Ich möchte, dass die Größe meines Spinnerbildes intakt bleibt und nur die Karussellbildhöhe geändert wird. Jetzt sieht das Spinnerbild sehr groß und verzerrt aus

@chandrasachin Hast du eine Lösung gefunden?
Meine Spinnergröße ist in der Karte wirklich größer als mein Bild. Ich möchte die Größe des Spinnerbildes für eine kleinere Größe ändern