Случайные загруженные ajax миниатюры галереи, обрезанные по высоте (отображается не полностью)?

Я создал систему фотогалереи, в которой по нажатию кнопки миниатюры галереи загружаются из папки с помощью вызова ajaxFunction. Вы нажимаете большие пальцы, и открывается полная версия изображения. Довольно распространенная настройка.

Средний размер моих миниатюр около 57к. Максимальное количество больших пальцев в галерее около 100. Все миниатюры размером 250px x 250px

Мой сервер относительно очень быстрый, и миниатюры загружаются очень быстро, но... случайно, несколько больших пальцев покажут половину отображаемого (обрезанного по высоте). Это не одни и те же изображения каждый раз. Это очень случайно. Иногда этого не происходит вообще, но обычно некоторые так отрезаются. Это почти как если бы он загружался слишком быстро или что-то еще, и вещи не заканчивались.

Там действительно нет CSS на самих эскизов. Просто немного набивки.

Не уверен если:

Это проблема css (возможно, нужно определить высоту или другой стиль)?

или же

Это проблема AJAX, и код должен быть отредактирован, чтобы не отображаться, пока они не будут полностью загружены. (что я не уверен, как это сделать)?

Это часть моего файла JS, который загружает изображения.

$( document ).ready(function() {
ajaxFunction = function(gallery) {
  $.ajax({
      cache: false,
    url : gallery.thumbs,
    success: function (data) {
      $(data).find("a").attr("href", function (i, val) {
        if( val.match(/\.(JPG|jpe?g|png|gif)$/) ) {
            $("#griddie").append( "<a class='item' href='"+ gallery.full + val +"'><img class='squares' src='"+ gallery.thumbs + val +"'></a>" );
          }
      });
    }
  });
};
$.getScript("links.js");
$(document).ajaxComplete(function(){
$("#lightgallery").lightGallery({
        selector: '.item',
        speed: 180,
        cssEasing: 'cubic-bezier(0.000, 0.000, 0.580, 1.000)',
        hideBarsDelay: 1800
});
});
});

Я не лучший в jQuery, но я учусь и изучил этот вопрос заранее, но не могу найти тему, достаточно релевантную. Какие-либо предложения? Кто-нибудь сталкивался с этим при вызове миниатюр через ajaxFunction?

Спасибо

0 ответов

Другие вопросы по тегам