Question

(Please note: I have one similar question active – but it’s completely different as to the problem)

Please see here for an example

As you click through the left navigation menu, notice that every other click the preloader doesn’t disappear… I don’t know why.

Here’s the code I have:

I left some comments to make it easier to understand. Thanks a lot everyobody 🙂

var pageToLoad = '';
switch( this.id ){
        case 'events_map_button':
      $('#huge-loader').fadeIn('fast', function() {  //show preloader
      pageToLoad = 'partytool.html';                 //define page to load
      });
      break;
        case 'event_search_tool_button':
      $('#huge-loader').fadeIn('fast', function() {
      pageToLoad = 'partytool.html';
          configureEvents();
      });
      break;
        case 'party_photos_button':
      $('#huge-loader').fadeIn('fast', function() {
      pageToLoad = 'partyphotos.html';
      });
      break;
        case 'taxi_finder_button':
      $('#huge-loader').fadeIn('fast', function() {
      pageToLoad = 'taxiservices.html';
      });
      break;
        case 'weather_forecast_button':
      $('#huge-loader').fadeIn('fast', function() {
      pageToLoad = 'weatherforecast.html';
      });
      break;
        case 'contact_button':
      $('#huge-loader').fadeIn('fast', function() {
      pageToLoad = 'contact.html';
      });
      break;
}
if( '' !== pageToLoad ){                                //if the variable isn't empty
   $('#right-content').load( pageToLoad, function() {   //load the page
   $("#huge-loader").fadeOut("slow");                   //then hide preloader
   });
}

Answer 1

You are hitting the bottom portion of the code before the pageToLoad is set.
Put that bottom portion in each of your fadeout complete functions.