jquery - 水平スライダーでの画像の遅延読み込み

Question

jquery lazyload としきい値を使用して、このサイトの画像を遅延読み込みしています: https://bm-translations.de/#leistungen

//Lazyload Images with Threshold https://www.appelsiini.net/projects/lazyload
$(function() {
    $("img.lazy").lazyload({
        threshold : 400
    });
}); 

したがって、 Imagessrcは に置き換えられdata-originalます。要素までスクロールすると、それが に変更さsrcれます。

しかし、ご覧のとおり、何らかの理由で、ブートストラップスライダーでの画像の読み込みが遅すぎます（クリックしたとき、または自動スライドで一部の画像が読み込まれませんでした）。このコードを調整するにはどうすればよいのでしょうか?

スライダーには、次のような一般的な構造があります: https://www.w3schools.com/bootstrap/bootstrap_carousel.asp

カルーセル JS は次のとおりです。

$('#myCarousel').carousel({
        interval: 9000,
    });

    // handles the carousel buttons
    $('[id^=carousel-selector-]').click( function(){
      var id_selector = $(this).attr("id");
      var id = id_selector.substr(id_selector.length -1);
      id = parseInt(id);
      $('#myCarousel').carousel(id);
      $('[id^=carousel-selector-]').removeClass('selected');
      $(this).addClass('selected');
    });

    // when the carousel slides, auto update
    $('#myCarousel').on('slide.bs.carousel', function (e) {
      var id = $('.item.active').data('slide-number');
      id = parseInt(id)+1;
      $('[id^=carousel-selector-]').removeClass('selected');
      $('[id=carousel-selector-'+id+']').addClass('selected');
    });

私はこれを試しましたが、もうスライドしませんでした：

$('#myCarousel').carousel({
        interval: 9000,
        scroll: {
            onBefore: function( data ) {
              var $current = data.items.visible.first(),
                  visible = data.items.visible,
                  src = visible.data('src');

              visible.attr('src', src);
            }
        }
    });

それを修正する方法は、クリック/オートスライドの前に遅延ロードするか、少なくともカルーセル画像全体をしきい値で遅延ロードすることですか?