Percentage of Completion

Asked

Viewed 105 times

-2

Can you tell me if it is possible to do the same image in Optimizemember (Plugin for member area) ? Or know any Wordpress plugin that does ?? Grateful

http://prntscr.com/86wng3

wordpress percentage

1 answer

2

You can do this with jquery, I created a basic example.

Javascript:

$(function(){
    var total = $('input[type=checkbox]').length;

    $('input[type=checkbox]').on('change', function(){
        var selecionados = $('input[type=checkbox]:checked').length;

        var porcentagem = (selecionados/total) * 100;

        $('.bar-loaded').animate({
            width: porcentagem+'%'
        });

        $('#box p').html(porcentagem+'%');
    });
});

HTML:

<div id="box">
    <p>0%</p>
    <div class="bar">
        <div class="bar-loaded"></div>
    </div>

    <ul>
        <li>
            <label><input type="checkbox" /> Item 1</label>
        </li>
        <li>
            <label><input type="checkbox" /> Item 2</label>
        </li>
        <li>
            <label><input type="checkbox" /> Item 3</label>
        </li>
        <li>
            <label><input type="checkbox" /> Item 4</label>
        </li>
    </ul>
</div>

The example in operation here

Browser other questions tagged wordpress percentage

You are not signed in. Login or sign up in order to post.