加載GIF以匹配DIV的加載時間。 jquery

我有一個JavaScript檢索從一組複選框檢查值並加載一個DIV傳遞這些值。加載GIF以匹配DIV的加載時間。 jquery

目前我在DIV的加載之前顯示「加載」.gif。但是，它已經確定了時間。

我想設置這個GIF的時間，直到DIV完全加載它的內容，所以用戶知道數據加載的情況下，有時比別人慢。

有什麼想法？

謝謝！

$(function() { 
    $("input[type='checkbox']").on('change', function() { 
     var colors = []; 
     $("input[type='checkbox']:checked").each(function() { 
      colors.push(this.value); 
     }); 
     if (colors.length) { 
      $(".loadingItems").fadeIn(300); 
      $(".indexMain").load('indexMain.php?color=' + colors.join("+"), function() { 
       $(".indexMain").fadeIn(slow); 
      }); 
      $(".loadingItems").fadeOut(300); 
     } else { 
      $(".loadingItems").fadeIn(300); 
      $(".indexMain").load('indexMain.php', function() { 
       $(".loadingItems").fadeOut(300); 
      }); 
     } 
    }); 
});

來源

2012-08-22 samyb8

把淡出：'$（」。 loadItems「）。fadeOut（300）;'在回調中，就像你在'else'部分做的那樣，它應該起作用。 –

另外，你忘了在那裏引用''slow''。 –

至於建議的@Fabricio磨砂，解決辦法是把第一淡出負載內與負載推出的函數內部：

  $(".indexMain").load('indexMain.php?color=' + colors.join("+"), function() { 
       $(".indexMain").fadeIn(slow); 
$(".loadingItems").fadeOut(300); 
      });

來源

2012-08-22 19:17:26 samyb8

加載GIF以匹配DIV的加載時間。 jquery

回答

相關問題