Created
April 13, 2022 06:46
-
-
Save AchalJ/44626da2775de63fec8c731fe8319272 to your computer and use it in GitHub Desktop.
PowerPack Category Post Count animation on reveal
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| $(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 ); | |
| } | |
| }); | |
| } | |
| }); | |
| }); |
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| .animate-post-count .pp-category-count:not(.revealed) { | |
| opacity: 0; | |
| } |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
I can't seem to get this to work in the wordpress environment. I am not getting any errors in the console.