Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nam at ullamcorper mauris, vitae imperdiet tortor. Cras aliquet gravida lacus eu auctor
Create Beautiful Number Counters Easily
<div class = "col-lg-4 wdpk-counter">
<div class = "wdpk-counter-wrapper">
<div class = "wdpk-counter-icon">
<div class = "wdpk-counter-icon-wrapper">
<i class = "far fa fa-star"></i>
</div>
</div>
<div id = "wdpk-counter"></div>
<div class = "wdpk-counter-footnote">Clients</div>
</div>
</div>
<div class = "col-lg-4 wdpk-counter">
<div class = "wdpk-counter-wrapper">
<div class = "wdpk-counter-icon">
<div class = "wdpk-counter-icon-wrapper">
<i class = "fab fa fa-apple"></i>
</div>
</div>
<div id = "wdpk-counter-2"></div>
<div class = "wdpk-counter-footnote">With Prefix</div>
</div>
</div>
<div class = "col-lg-4 wdpk-counter">
<div class = "wdpk-counter-wrapper">
<div class = "wdpk-counter-icon">
<div class = "wdpk-counter-icon-wrapper">
<i class = "far fa fa-paper-plane"></i>
</div>
</div>
<div id = "wdpk-counter-3"></div>
<div class = "wdpk-counter-footnote">With Suffix</div>
</div>
</div>
$wdpk-gray-300: #dee2e6 !default;
$wdpk-gradient-1: #0056c6 !default;
$wdpk-gradient-2: #0bc9cd !default;
$wdpk-counter-font-color: #ffffff !default;
$wdpk-counter-prefix-font-color: rgba(255,255,255,0.8) !default;
$wdpk-counter-suffix-font-color: $wdpk-counter-prefix-font-color !default;
$wdpk-counter-footnote-font-color: rgba(255,255,255,0.8) !default;
$wdpk-counter-icon-font-hover-color: #ffffff !default;
$wdpk-counter-icon-border-width: 0px !default;
$wdpk-counter-icon-border-color: none !default;
$wdpk-counter-icon-background-color: none !default;
$wdpk-counter-background-map: (
backgroundType: gradient,
gradientType: linear,
color1:$wdpk-gradient-1,
color2: $wdpk-gradient-2,
degree: 0deg,
backgroundImage: url(../../assets/images/background-black.jpg),
backgroundRepeat: repeat-x,
backgroundHorPos: center,
backgroundVerPos: center,
backgroundSize: initial
) !default;
jQuery(document).ready(function ()
{
if (jQuery("#wdpk-counter").length !== 0)
{
let obj = {
selectorID: 'wdpk-counter',
startNumber: 0,
EndNumber: 9840,
decimalPlaces: 0,
countDuration: 2.5, // in seconds
useEasing: true,
useGrouping: true,
separator: ',',
decimal: '.',
prefix: '',
suffix: ''
};
let obj2 = {
selectorID: 'wdpk-counter-2',
startNumber: 0,
EndNumber: 8000,
decimalPlaces: 0,
countDuration: 2.5, // in seconds
useEasing: true,
useGrouping: true,
separator: ',',
decimal: '.',
prefix: '$',
suffix: ''
};
let obj3 = {
selectorID: 'wdpk-counter-3',
startNumber: 0,
EndNumber: 6432,
decimalPlaces: 0,
countDuration: 2.5, // in seconds
useEasing: true,
useGrouping: true,
separator: ',',
decimal: '.',
prefix: '',
suffix: '#'
};
require(["app/shortcodes/wdpkCounter"], function (e)
{
e.publicCall(obj);
e.publicCall(obj2);
e.publicCall(obj3);
});
}
});