Skip to content

Instantly share code, notes, and snippets.

@AchalJ
Created April 13, 2022 06:46
Show Gist options
  • Select an option

  • Save AchalJ/44626da2775de63fec8c731fe8319272 to your computer and use it in GitHub Desktop.

Select an option

Save AchalJ/44626da2775de63fec8c731fe8319272 to your computer and use it in GitHub Desktop.
PowerPack Category Post Count animation on reveal
$(window).on('scroll.pp-animate', function() {
var scrollTop = $(window).scrollTop(),
winHeight = $(window).height(),
triggerpoint = winHeight * .8 + scrollTop;
// If module has animation, otherwise remove .fl-animated class here.
$('.animate-post-count.fl-animated .pp-category-count').each(function() {
if ( $(this).hasClass( 'revealed' ) ) {
return;
}
var counterElement = $(this).offset().top;
if ( counterElement < triggerpoint ) {
$(this).addClass( 'revealed' );
$(this).attr( 'data-counter-id', new Date().getTime() );
var $this = $(this),
countVal = parseInt( $this.data('count') );
upto = 0;
$this.prop('Counter', 0).animate({
Counter: countVal
}, {
duration: 500,
easing: 'swing',
step: function ( now, fx ) {
$this.text( parseInt(now) );
},
complete: function() {
$this.text( countVal );
}
});
}
});
});
.animate-post-count .pp-category-count:not(.revealed) {
opacity: 0;
}
@DIFDESIGN

Copy link
Copy Markdown

I can't seem to get this to work in the wordpress environment. I am not getting any errors in the console.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment