同位素执行过滤器时，何处放置加载图像？

Question

当要求过滤时，同位素可能需要一段时间才能返回。

所以，我想在发生这种情况时使用一个loading.gif。我怀疑一些jQuery会做的伎俩，但不知道它应该看起来像在哪里或什么样子。

同位素很简单：

var $container = $('#stream'); 

$container.imagesLoaded(function(){ 
    $container.isotope({ 
itemSelector: '.stream-class', 
transformsEnabled: false, 
    }); 
}); 

然后，我用简单的按钮像那些在文档触发过滤器：

$('#filters a').click(function(){ 
    var selector = $(this).attr('data-filter'); 
    $container.isotope({ filter: selector }); 
    return false; 
}); 

在此先感谢您的帮助！

Answer 1

这个工作对我来说：

$('#filters a').click(function() { 
    var selector = $(this).attr('data-filter'); 
    var lastClicked = $("#filtersLoad2").text(); 


if(lastClicked == selector) { 

    return false;  

} 

    $("#filtersLoad").show(); // Show loading gif in div 
    $container.isotope({ 
     filter: selector 
    }, function(){ 
     $("#filtersLoad").hide(); 
     $("#filtersLoad2").text(selector); // Store last button clicked 
    }); 

    return false; 
}); 

希望这可以帮助其他人。