{"id":15043,"date":"2024-08-21T19:29:26","date_gmt":"2024-08-22T02:29:26","guid":{"rendered":"https:\/\/codedcommerce.com\/?page_id=15043"},"modified":"2024-08-21T19:29:26","modified_gmt":"2024-08-22T02:29:26","slug":"javascript-counter-animation","status":"publish","type":"woo-code","link":"https:\/\/codedcommerce.com\/woo\/javascript-counter-animation\/","title":{"rendered":"JavaScript counter animation"},"content":{"rendered":"\n<pre class=\"wp-block-code language-javascript\"><code>document.querySelectorAll( '.counter' ).forEach( counter => {\n\tconst target = +counter.innerText;\n\tcounter.innerText = 0;\n\tconst updateCount = () => {\n\t\tconst count = +counter.innerText;\n\t\tconst increment = target \/ 50;\n\t\tif( count &lt; target ) {\n\t\t\tcounter.innerText = Math.round( count + increment );\n\t\t\tsetTimeout( updateCount, 50 );\n\t\t} else {\n\t\t\tcounter.innerText = target;\n\t\t}\n\t};\n\tupdateCount();\n} );<\/code><\/pre>\n","protected":false},"template":"","class_list":["post-15043","woo-code","type-woo-code","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/codedcommerce.com\/wp-json\/wp\/v2\/woo-code\/15043","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/codedcommerce.com\/wp-json\/wp\/v2\/woo-code"}],"about":[{"href":"https:\/\/codedcommerce.com\/wp-json\/wp\/v2\/types\/woo-code"}],"wp:attachment":[{"href":"https:\/\/codedcommerce.com\/wp-json\/wp\/v2\/media?parent=15043"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}