javascript - 使用JQuery显示/隐藏计时以加载动画

标签 javascript jquery loading-animation

我有这段代码依赖于Embedly API来用视频和缩略图替换链接:

$('a.oembed').each(function(){
    $(this).embedly({maxWidth:525,'method':'replace'}).bind('embedly-oembed', function(e, oembed){ 
        $(this).parent().append($("<img>", { src: oembed.thumbnail_url, width:200 })).children('img').wrap('<div class="thumbnail_border" />');
    });  
});


我要在发出此请求时显示加载图像,并在返回缩略图时将其隐藏。我该怎么做?

我也有隐藏隐藏缩略图并显示视频的代码:

$(".thumbnail_border img").live('click', function() {

   $(this).toggle();    
   $(this).parent().hide();
   $(this).parent().parent().children('.embed').toggle();
   $(this).parent().parent().children("div.description_div").hide();

});


我想在用户单击时显示加载图像,并且在视频出现后将其隐藏。我也将如何做?

最佳答案

使用回调作为tfbox建议。使用以下效果:

$(“ urdiv”)。fadeIn('slow');和$(“ urdiv”)。fadeOut('slow')//有关详细信息,请参见jquery文档


一些信息here

关于javascript - 使用JQuery显示/隐藏计时以加载动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/6172318/

相关文章:

javascript - 将 bootstrap-slider 与 jQuery UI 结合使用

javascript - 递归地创建新的 promise

javascript - 在插入的手动 div 上应用样式

javascript - 带有网格的 jQuery 可调整大小居中 div 产生意想不到的结果

javascript - 获取选择框以在不同的选择框中显示所选值

html - 加载动画不起作用

javascript - 使用 Angular JS 过滤器转换日期失败

javascript - 没有对 Angular 线的三.js BoundingBoxHelper

Vue.js 在 index.html 的 <body> 而不是 <head> 中注入(inject)样式(webpack、HtmlWebpackPlugin)