如何显示“正在加载”＃39;在JS中使用.load的动画？

Question

我正在提取一个需要一些细节的WSGI URI，但在加载URI详细信息时需要几秒钟的等待时间。加载动画“加载”的最佳方法是什么？图像，直到收到URI响应？

我使用的JS代码是：

<script type="text/javascript">
jQuery(function($){
$('#overview').load('<WSGI URI HERE>');
});
</script>

然后在DIV中调用：

<div id="overview"></div>

Answer 1

您可以显示加载指示符并在加载图像时隐藏加载指示符。您必须添加一个<div> - 包含指标的块，并将其放置在图像顶部。

$('#overview').load('<WSGI URI HERE>', function() {
  $('#spinner').fadeOut();
});

您可以在以下网址找到大量的加载指标：http://preloaders.net/ru 您还可以在https://github.com/tobiasahlin/SpinKit找到有趣的微调器 并在：https://github.com/lukehaas/css-loaders