Javascript - 在SetTimeout中加载图标

时间:2012-03-01 08:50:01

标签: javascript jquery loops time

我有一个具有设置超时变量的循环。如何在倒计时时制作加载图标,然后可能会有一些代码停止旋转(或只是显示)。我认为jquery旋转可能会成功,但我不热衷于插件。

3 个答案:

答案 0 :(得分:1)

如果您不介意使用一些JavaScript,那么

http://fgnass.github.com/spin.js/似乎做得很好。另一种可能性是您只需手动显示和隐藏的GIF,您可以使用http://ajaxload.info/之类的内容生成。

答案 1 :(得分:1)

function imgload(){
setTimeout(function(){$('#response').html('<img src="imagse/load.gif">');  },2000);
}


the load image rotates for 2 seconds..

答案 2 :(得分:0)

这可以在没有任何插件的情况下工作,但它假设您知道从开始显示加载图像到您希望停止显示加载图像的点的过程需要多长时间。

var countdown = 5000;  // your countdown in milliseconds

setTimeout(function() {
    // hide your loading image after "countdown" milliseconds
    document.getElementById("loading-image").setAttribute("style","display:none");

}, countdown);

// show your loading image
document.getElementById("loading-image").setAttribute("style","display:block");


<img style="display:none" src="/loading.gif" id="loading-image" alt="Loading..." />

当然,如果您希望基于其他事件停止加载图像,您可以使用以下命令隐藏该特定回调方法中的图像:

document.getElementById("loading-image").setAttribute("style","display:none");

既然你有这个答案,我建议你重新考虑一下你对插件的立场。任何领域的最佳工程师都建立在他们面前的平台之上。当你站在巨人的肩膀上时,你可以很快完成很多事情。