• Hello, I am trying to enable the preloader only for a specific page , that being the catalog page; due to the fact it takes the longest to load.

    this is the modified pre-loader.js

    jQuery(function($){
    
    	var width = 100,
    	    perfData = window.performance.timing, // The PerformanceTiming interface represents timing-related performance information for the given page.
    	    EstimatedTime = -(perfData.loadEventEnd - perfData.navigationStart),
    	    time = parseInt((EstimatedTime/1000)%60)*100;
    
      if (window.location.href.indexOf("/transportation-fleet-registry/") > -1) {
        var preloader = document.querySelector(".preloader-plus");
        $('body').prepend(preloader);
    
        var progBar = document.querySelector(".prog-bar"),
          start = 0,
          end = 70,
          duration = time,
          counter = document.getElementById("preloader-counter");
    
        animateValue(progBar, start, end, duration);
      } else {
        $('body').addClass('complete');
      }
    
    	function animateValue(element, start, end, duration) {
    
      	var range = end - start,
        	current = start,
        	increment = end > start? 1 : -1,
        	stepTime = Math.abs(Math.floor(duration / range)),
        	obj = element;
    
        var timer = setInterval(function() {
    			if(current < end) {
    				current += increment;
    			}
    			if (obj !== null) {
    				obj.style["transition-duration"] = "0.001s";
    				obj.style.width= current + "%";
    			}
    			if (counter !== null) {
          	counter.innerHTML = current + "%";
    			}
          if ( ( current == end && perfData.loadEventEnd > 0 ) || perfData.loadEventEnd > 0 ) {
    				var endLoading = setInterval( function() {
    					current += increment;
    					if (obj !== null) {
    						obj.style.width= current + "%";
    					}
    					if (counter !== null) {
    		      	counter.innerHTML = current + "%";
    					}
    					if(current == 100) {
    						setTimeout( function() {
    							$('body, .preloader-plus').addClass('complete');
    						}, preloader_plus.animation_delay)
    						clearInterval(endLoading);
    					}
    				}, 1)
    				clearInterval(timer);
          }
        }, stepTime);
    	}
    
    });
    

    thought the “if” statement would have worked. any suggestions will help, thank you.

    The page I need help with: [log in to see the link]

  • The topic ‘Enabling preloader only for a specific page’ is closed to new replies.