Jquery 为引导滑块创建特殊进度条

我有一个引导滑块设置在我的网站，我想在其中添加一个滑块计时器进度条。但是我需要创建的酒吧与标准有点不同

基本上，它是一个带点边框的透明半圆。边框的每个点都将填充白色，以显示进度。 你知道我怎么做吗

<div id="event-slider" class="carousel slide" data-ride="carousel">

    <div class="carousel-inner"> 
        <!-- begin carousel-slide -->  
        <?php
        $slides = xs_get_option('theme_options', 'main_slider');
        $active = 'active';
        foreach ($slides as $arr) {
            echo '<div class="item ' . $active . '"> <img src="' . $arr['img_src'] . '" alt="' . $arr['title'] . '" class="img-responsive" /> </div>';
            $active = '';
        }
        ?>
        <!-- end carousel-slide --> 
    </div>
    <!-- end carousel-inner --> <div class="progressBar"></div> 
    <!-- Controls --> 
    <a class="left carousel-control" href="#event-slider" data-slide="prev"> <i class="fa fa-chevron-left"></i></a>
    <a class="right carousel-control" href="#event-slider" data-slide="next"> <i class="fa fa-chevron-right"></i></a>
</div>

---

提前感谢。

请在问题中发布您的代码。对不起，我正在与编辑器纠缠。但我现在已经发布了：）请在问题中发布您的代码。对不起，我正在与编辑器抗争。但我现在已经发布了：）