Question

如何显示按钮，直到它们从外部来源完全加载。在加载按钮之前，有一个gif预加载器，指示加载正在进行中。我发布的代码正在显示按钮，但它会逐个加载，而不是同时加载。

我的代码是：

<div class="social-holder">
        <div class="social-buttons-holder">

        </div>
</div>

当用户在班级上跳过div＆＃34;社交持有者＆＃34;按钮将从名为＆＃34; social＆＃34;。

的外部页面加载

$('.social-holder').hover(function(){
    if($(".social-buttons").length > 0){
        $('.social-buttons-holder').show();
    } 
    else {
        $('.social-buttons-holder').addClass('preloader');
        $('.social-buttons-holder').load('/social', function() {
            $('.social-buttons-holder').removeClass('preloader');
        });
    }
}, function(){
    $('.social-buttons-holder').hide();
});

外部页面的结构是：

<div class="social-buttons">
    <div class="social-button">

    </div>
    <div class="social-button">

    </div>
    <div class="social-button">

    </div>
</div>

每个div与课程＆＃34;社交按钮＆＃34;包含社交按钮的标准代码，所以我不会在这里发布。因此，当用户在课堂上徘徊于div＆＃34; social-holder＆＃34;，div with class＆＃34; social-buttons＆＃34;将使用class＆＃34; social-buttons-holder＆＃34;加载到div内部。如果社交按钮尚未加载类＆＃34; preloader＆＃34;添加到显示预加载器gif图像的div中。当Jquery加载外部内容时，＆＃34; preloader＆＃34; class已删除，但按钮在iframe中逐个加载，我希望它们同时加载，因为预加载器应隐藏其加载过程

隐藏社交按钮，直到从外部源完全加载

0 个答案: