Advertisement
oscarviedma

Función PHP - JavaScript OV Preloader

Oct 25th, 2024 (edited)
301
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
PHP 2.23 KB | None | 0 0
  1. function add_ov_preloader_script() {
  2.     if (isset($_GET['et_fb'])) {
  3.         return;
  4.     }
  5.     ?>
  6.     <script>
  7.         document.addEventListener('DOMContentLoaded', () => {
  8.             const preloader = document.querySelector('.ov-preloader');
  9.             const preloaderBg = document.querySelector('.ov-preloader-background');
  10.             const progressElement = document.querySelector('.ov-loading-progress');
  11.            
  12.             function animateCounter() {
  13.                 const duration = 1000;
  14.                 const start = performance.now();
  15.                
  16.                 function update(currentTime) {
  17.                     const elapsed = currentTime - start;
  18.                     const progress = Math.min(elapsed / duration, 1);
  19.                    
  20.                     const easeProgress = 1 - Math.pow(1 - progress, 3);
  21.                     const currentValue = Math.floor(easeProgress * 100);
  22.                    
  23.                     if (progressElement) {
  24.                         progressElement.textContent = `${currentValue}%`;
  25.                     }
  26.                    
  27.                     if (progress < 1) {
  28.                         requestAnimationFrame(update);
  29.                     } else {
  30.                         startReveal();
  31.                     }
  32.                 }
  33.                
  34.                 requestAnimationFrame(update);
  35.             }
  36.  
  37.             function startReveal() {
  38.                 if (preloader) {
  39.                     preloader.classList.add('ov-loaded');
  40.                 }
  41.  
  42.                 setTimeout(() => {
  43.                     if (preloaderBg) {
  44.                         preloaderBg.classList.add('fade-out');
  45.                     }
  46.                 }, 1000);
  47.  
  48.                 setTimeout(() => {
  49.                     if (preloader) {
  50.                         preloader.style.display = 'none';
  51.                     }
  52.                     if (preloaderBg) {
  53.                         preloaderBg.style.display = 'none';
  54.                     }
  55.                 }, 2000);
  56.             }
  57.  
  58.             window.addEventListener('load', () => {
  59.                 animateCounter();
  60.             });
  61.         });
  62.     </script>
  63.     <?php
  64. }
  65. add_action('wp_footer', 'add_ov_preloader_script', 99);
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement