Не прорисовываются автоматически картики после ajax-запроса и рендеринга страницы
Не прорисовываются картинки (только картинки) после выполнения ajax-запроса и рендеринга фрагмента страницы в таргетированном div. С адресами все в порядке. Картинка прорисовывается, как только системе приходится обновить весь экран (допустим - потянуть скроллом вверх или вниз). Сам ajax запрос может возвращать фильтрованных список в виде products:
...
{% for product in products %}
...
<div class="no-margin col-xs-12 col-sm-4 image-holder">
<div class="image">
<img alt="" src="{% static 'assets/images/blank.gif' %}" data-echo="{{ product.images.first.image.url }}"/>
</div>
</div>
...
{% endfor %}
Или даже в элементе карусели картинок при прокручивании первые четыре показываются, потому как "географически" попадают в область экрана монитора, а пятая уже лежит за его пределами, и когда карусель до нее доходит, получаю белое поле. Картинка подгружается только после малейшего движения экрана:
<div id="owl-single-product" class="owl-carousel">
{% for image in product.images.all %}
<div class="single-product-gallery-item" id="slide{{ forloop.counter }}">
<a data-rel="prettyphoto" href="{{ image.image.url }}">
<img class="img-responsive" alt="" src="{% static 'assets/images/blank.gif' %}" data-echo="{{ image.image.url }}" height="325" width="433"/>
</a>
</div><!-- /.single-product-gallery-item -->
{% endfor %}
</div><!-- /.single-product-slider -->
Подскажите, пожалуйста, в какую сторону думать. Всю логику расписал, как надо, фильтрация работает, эту проблему оставил на потом. Вот сейчас вернулся и не нахожу, с какой стороны подойти. Заранее спасибо