add jquery counterup plugin to symfony 2 with assetic

53 Views Asked by At

I'm trying to add a counter up effect to my home page in a symfony 2 application with angular . i have added dependencies in my config.yml file like this :

counter:
        inputs:
            - "bundles/ubidelectricity/js/custom/waypoints.min.js"
            - "bundles/ubidelectricity/js/custom/jquery.counterup.min.js"

and i have called counter in my twig like this :

{% block javascripts %}
{% javascripts
'@jquery'
'@bootstrap_4_js'
'@jqueryui'
'@elfinder'
'@fastclick'
'@angular'
'@angular_storage'
'@angular_table'
'@angular_translate'
'@angular_scroll'
'@angular_file_uplaod'
'@angular_dynamic_locale'
'@bootstrap_colorpicker'
'@videogular'
'@oclazyload'
'@breadcrumb'
'@ui_bootstrap'
'@loading_bar'
'@color_picker'
'@locationpicker'
'@multirange_slider'
'@site_front_scripts'
'@continuous_net_services'
'@continuous_net_directives'
'@site_front_controller' %}<script src="{{ asset_url }}"></script>
{% endjavascripts %}
{% endblock %}

and i have added html in the front page like this :

<div class="row pt-5 pb-5">
<div class="col-md-3 text-center">
    <span class="counter">3300</span> <span class="counters">+</span>
    <span class="counter-text">Buyers Organisations</span>
</div>
<div class="col-md-3 text-center">
    <span class="counter">585</span>
    <span class="counter-text">Buyer Partners</span>
</div>
<div class="col-md-3 text-center">
    <span class="counter">41000</span> <span class="counters">+</span>
    <span class="counter-text">Tenders / Quotes </span>
    <span class="counter-text"> Every Year </span>
</div>
<div class="col-md-3 text-center">
    <span class="counter">658</span>
    <span class="counter-text">Industry Categories</span>
</div>
</div>

I use :

php app/console assets:install
php app/console assetic:dump
php app/console assetic:watch

but it doesn't work and there are no animations.

0

There are 0 best solutions below