Foundation 6 Interchange data-src

Question

Возможно ли сделать так, чтобы interchange-foundation 6 при изменении размера заменил путь к атрибуту data-src вместо src изображения?

И то же самое поведение на фоновом изображении в DIV, замените путь на data-src вместо style = "background-image.

Я пытаюсь показать изображения только в окне просмотра, какая-то ручная ленивая загрузка с использованием обмена.

Я удаляю src при загрузке страницы:

/*Stop Interchange Background Images loading images*/

    $(".delay").each(function(){
        var img_src = $(this).attr('src');
        $(this).attr("data-src", img_src);
        $(this).attr('src', '');
    });

/*Stop Interchange Background Images loading for DIVs and Slides*/

    $(".backImg").each(function(){
        var img_backImg = $(this).css('background-image');
        $(this).attr("data-src", img_backImg);
        $(this).css('background-image','');
    });

Затем добавляется фоновое или фоновое изображение, как только изображение касается окна просмотра. Это работает хорошо, но моя проблема сейчас в том, что изображение появляется автоматически при изменении размера.

поэтому, если Interchange использует data-src для изменения URL-адреса, я могу взять URL-адрес и вставить его в нужное место.

Надеюсь, что это имеет смысл для кого-то, кто может мне помочь.

Большое спасибо!

Answer 1

Ответьте на мой собственный вопрос:

Я нашел не красивый способ сделать это, но прекрасно работает:

редактирование файла foundation.js:

Строка 6253:

this.$element.attr('src', path).load(function () {

Заменить:

this.$element.attr('data-original', path).load(function () {

Строка 6259 (для фоновых изображений):

this.$element.css({ 'background-image': 'url(' + path + ')' }).trigger(trigger);

Rempace:

this.$element.attr('data-original', path).load(function () {
            _this.currentPath = path;
          }).trigger(trigger);