幻灯片JS - 而不是子弹分页..需要使用div容器

Question

我们需要修改现有的slide JS插件（不应该使用任何其他插件）才能从默认版本修改为修改版本。默认版本已在其他页面上使用。

而不是默认的子弹导航，必须使用像附加屏幕截图中的div容器。当点击该div时，它必须显示该幻灯片的索引，就像在默认函数中发生的一样。

HTML

<div class="content--carousel">
<div class="slides-item">
    <a href="#">
        <img src="http://placehold.it/1120x632">
        <span class="gradient-bg"></span>
    </a>
</div>
<div class="slides-item">
    <a href="#">
        <img src="http://placehold.it/1120x632">
        <span class="gradient-bg"></span>
    </a>
</div>
</div>

//Thumbnail like div container 
<div class="carousel-thumb">
<div class="carousel-thumb--content">
    <a href="#">
        <div class="carousel-thumb--image">
            <img src="http://placehold.it/63x63">
        </div>
        <div class="carousel-thumb--text">
            <div class="carousel-thumb--title">Lorem ipsum dolor</div>
            <div class="carousel-thumb--desc">Ut fringilla augue eget quam lacinia</div>
        </div>
    </a>
</div>
<div class="carousel-thumb--content active">
   <a href="#">
        <div class="carousel-thumb--image">
            <img src="http://placehold.it/63x63">
        </div>
        <div class="carousel-thumb--text">
            <div class="carousel-thumb--title">Lorem ipsum dolor</div>
            <div class="carousel-thumb--desc">Ut fringilla augue eget quam lacinia</div>
        </div>
    </a>
</div>
</div>