Lazy Load

Bonjour,

je reviens vers vous afin de régler un problème qui persiste depuis des mois sur mon site.
J'ai mis en place le lazy load, il fonctionne très bien sur les images distribuées par la balise img. Le code ne fonctionne par contre pas sur les images distribuées en background, à travers le css. Il y a pourtant ce qu'il faut d'installé sur le code JavaScript pour le faire, mais il me manque quelque chose, un mauvais chemin ou autre.
J'utilise l'API Intersection Observer et le code JavaScript tiré du site suivant :
https://blog.internet-formation.fr/2018/11/faire-du-lazy-loading-avec-lapi-intersection-observer-javascript/
Voici la partie html concernée sur mon site:

<div id="seve" class="fixed-bg bg-1-1 bckg-img">

Le id est une ancre sur la page et il y a quatre sections identiques.
Le css pour les images:

.bg-1-1 .bckg-img {
	background-image:none;}
.bg-1-1 {
  	background-image:url("Images/Acacia-C.jpg");}

Je n'ai mis qu'une section, il y en a quatre.
Et le code JavaScript concerné (uniquement la partie qui concerne le background, le code entier est sur le site listé plus haut).

var backgroundObserver = new IntersectionObserver(function(entries, self) {
  entries.forEach(function(entry) {
    if(entry.isIntersecting) {
      entry.target.classList.remove("bckg-media");
      entry.target.classList.add("visible");
      self.unobserve(entry.target);
    }
  });
}, config);
var bckgMedias = document.querySelectorAll('.bckg-media');
bckgMedias.forEach(function(media) {
  backgroundObserver.POLL_INTERVAL = 100;
  backgroundObserver.observe(media);
});

Merci pour votre aide.