Bonjour,

J'ai fais un Bootstrap Carousel qui fonctionne bien mis à part le redimenssionnement des images qui ne se fait qu'en statique avec Liip_imagine. Dès que je fais une boucle for dessus, le redimensionnement ne fonctionne pas.

{# COTE DROIT ARTICLE #}
      <div class="col-md">
        <section>
          <div id="articleSingleCarousel" class="carousel slide" data-bs-ride="carousel">

            <div class="carousel-indicators">
              {% set is_image_1 = true %}
              {% for image in article.images %}
              {% if is_image_1 == true %}
              <button type="button" data-bs-target="#articleSingleCarousel" data-bs-slide-to="0" class="active"
                aria-current="true" aria-label="Slide 1"></button>
              {% else %}
              <button type="button" data-bs-target="#articleSingleCarousel" data-bs-slide-to="1" aria-label="Slide 2"></button>
              {% endif %}

              {% set is_image_1 = false %}
              {% endfor %}
            </div>

            <div class="carousel-inner">
              {% set is_image_1 = true %}
              {% for image in article.images %}
              {% if is_image_1 == true %}
              <div class="carousel-item active">
                {% else %}
                <div class="carousel-item">
                  {% endif %}
                  <img
                    src="{{ asset('uploads/articles/' ~ image.name, 'downloads') | imagine_filter('articleSingleCaroussel') }}"
                    class="d-block" alt="{{ article.title }}">
                </div>
                {% set is_image_1 = false %}
                {% endfor %}
              </div>

              <button class="carousel-control-prev" type="button" data-bs-target="#articleSingleCarousel" data-bs-slide="prev">
                <span class="carousel-control-prev-icon" aria-hidden="true"></span>
                <span class="visually-hidden">Previous</span>
              </button>
              <button class="carousel-control-next" type="button" data-bs-target="#articleSingleCarousel" data-bs-slide="next">
                <span class="carousel-control-next-icon" aria-hidden="true"></span>
                <span class="visually-hidden">Next</span>
              </button>
            </div>

          </div>
        </section>
      </div>
      {# / COTE DROIT ARTICLE #}
      {% endif %}
    </div>
  </section>
</div>

J'ai trouvé la solution mais je poste quand-même pour les autres: le nom de mon filtre était apparemment trop long "articleSingleCaroussel" alors je l'ai appelé "aSc" et miracle, le redimensionnement fonctionne à merveille.

Aucune réponse