# Counter

Counter is a lightweight plugin that counts up to a targeted number.

## Examples

Basically, you can toggle the milestone counter on any element you want. The advantage is that you can style it very easily without being constraint of pre-defined styles.

Show code

    <span class="counter" data-from="0" data-to="1000" data-speed="1500" data-refresh-interval="100"></span>

### Heading

Show code

    <span class="h3 text-primary counter" data-from="0" data-to="1000" data-speed="1500" data-refresh-interval="100"></span>

### Button

Show code

    <button type="button" class="btn btn-primary">
        <span class="counter" data-from="0" data-to="1000" data-speed="1500" data-refresh-interval="100"></span> Downloads
    </button>

### Mix

Show code
%

###### Happy clients

x7

###### Customer support

    <div class="row">
        <div class="col-md-6 mb-5 mb-lg-0">
            <div class="text-center">
                <div class="h1 text-primary">
                    <span class="counter" data-from="0" data-to="97" data-speed="3000" data-refresh-interval="100"></span>
                    <span class="counter-extra">%</span>
                </div>
                <h6 class="text-capitalize">Happy clients</h6>
            </div>
        </div>

        <div class="col-md-6 mb-5 mb-lg-0">
            <div class="text-center">
                <div class="h1 text-primary">
                    <span class="counter" data-from="0" data-to="365" data-speed="3000" data-refresh-interval="100"></span>
                    <span class="counter-extra">x7</span>
                </div>
                <h6 class="text-capitalize">Customer support</h6>
            </div>
        </div>
    </div>