MDB旋转木马与django

时间:2018-06-16 15:10:37

标签: django bootstrap-4 bootstrap-carousel

我正在尝试使用来自我的django应用程序的动态数据实现轮播。然而,只要我添加动态数据,carosuel就会停止工作,我无法从一张图片导航到另一张图片。旋转木马只是“卡住了”#34;

我测试的数据很好。现在的主要问题是轮播

感谢任何建议,谢谢Here is how the image carousel looks

<!--Carousel Wrapper-->
<div id="carousel-example-2" class="carousel slide carousel-fade" data-ride="carousel">
    <!--Indicators-->
    <ol class="carousel-indicators">
        {% for img in car.image_set.all %}
        {% if forloop.counter0 == 0 %}
        <li data-target="#carousel-example-2" data-slide-to="{{ forloop.counter0 }}" class="active"></li>
        {% endif %}
        <li data-target="#carousel-example-2" data-slide-to="{{ forloop.counter0 }}" ></li>
        {% endfor %}
    </ol>
    <!--/.Indicators-->

    <!--Slides-->
    <div class="carousel-inner" role="listbox">
        {% for img in car.image_set.all %}
        <div class="carousel-item active">
            <div class="view">
                <img class="d-block w-100" src="{{ img.image.url }}" alt="{{ car.name }}">
                <div class="mask rgba-black-light"></div>
            </div>
            <div class="carousel-caption">
                <h3 class="h3-responsive">{{ car.model }}</h3>
                <p>{{ car.description }}</p>
            </div>
        </div>
        {% endfor %}
    </div>
    <!--/.Slides-->

    <!--Controls-->

    <a class="carousel-control-prev" href="#carousel-example-2" role="button" data-slide="prev">
        <span class="carousel-control-prev-icon" aria-hidden="true"></span>
        <span class="sr-only">Previous</span>
    </a>
    <a class="carousel-control-next" href="#carousel-example-2" role="button" data-slide="next">
        <span class="carousel-control-next-icon" aria-hidden="true"></span>
        <span class="sr-only">Next</span>
    </a>

    <!--/.Controls-->
</div>
<!--/.Carousel Wrapper-->

0 个答案:

没有答案