html - 水平缩略图图像滑块

Question

我有一个图像滑块，想在其下方的滑块中显示它的缩略图。

这是图像滑块代码：

<div class="slideshow-container">
    {% with images=ads_detail.image|images_slide %}
        {% for image in images %}
            <div class="mySlides">
                <img src="{{ image }}">
            </div>
        {% endfor %}
    {% endwith %}
    <div class="mySlides">
        <img src="{% static 'vira_app/wp/images/vira.png' %}">
    </div>
    <a class="prev" onclick="plusSlides(-1)">❮&lt;/a>
    <a class="next" onclick="plusSlides(1)">❯&lt;/a>
    <div class="row">
        {% with images=ads_detail.image|images_slide %}
            {% for image in images %}
                <div class="column" style="margin: 0 30 10 30;">
                    <img src="{{ image }}" onclick="currentSlide({{ forloop.counter }})">
                </div>
            {% endfor %}
        {% endwith %}
    </div>
</div>

标签： htmlcss