diff --git a/html/script.js b/html/script.js
index 7c0ece5..f54204e 100644
--- a/html/script.js
+++ b/html/script.js
@@ -1751,7 +1751,7 @@ function initFlagFilter(colors) {
 function push_history() {
     HistoryItemsReturned = 0;
     PositionHistoryBuffer = [];
-    jQuery("#loader_progress").attr('max',nHistoryItems);
+    jQuery("#loader_progress").attr('max',nHistoryItems + 1);
 
     for (let i = 0; i < nHistoryItems; i++) {
         push_history_item(i);
@@ -1775,8 +1775,8 @@ function push_history_item(i) {
             }
 
 
-            jQuery("#loader_progress").attr('value',HistoryItemsReturned);
             HistoryItemsReturned++;
+            jQuery("#loader_progress").attr('value',HistoryItemsReturned);
             if (HistoryItemsReturned == nHistoryItems) {
                 parseHistory();
             }
@@ -7227,7 +7227,7 @@ function drawHeatmap() {
         }
     }
     console.timeEnd("drawHeat");
-    jQuery("#loader").addClass("hidden");
+    jQuery("#loader").hide();
 }
 
 function currentExtent(factor) {
@@ -7894,11 +7894,16 @@ function refreshHistory() {
         noLongerHidden();
         return;
     }
+
+    jQuery("#loader_progress").attr('value', 0);
+    jQuery("#loader").show();
+
     chunksDefer().done(function(data) {
         console.log(localTime(new Date()) + ' tab change, loading history');
         g.refreshHistory = true;
         HistoryChunks = true;
         chunkNames = [];
+        jQuery("#loader_progress").attr('value', 1);
         try {
             for (let i = data.chunks.length-1; i >= 0; i--) {
                 let f = data.chunks[i];
@@ -7959,6 +7964,7 @@ function handleVisibilityChange() {
 }
 
 function noLongerHidden() {
+    jQuery("#loader").hide();
 
     active();
 
diff --git a/html/style.css b/html/style.css
index 79e6a9a..6d97ee2 100644
--- a/html/style.css
+++ b/html/style.css
@@ -278,7 +278,8 @@ select {
     white-space: pre-line;
 }
 
-#loader_progress { width:  25%; height: 30px; position: absolute; top: 50%; left: 37%; }
+#loader {position: absolute; width: 25%; height: 30px; z-index: 9999; top: 50%; left: 37.5%}
+#loader_progress { width:  100%; height: 100%; position: absolute; }
 
 
 .aircraft_table_header {